jsonform / jsonform

Build forms from JSON Schema. Easily template-able. Compatible with Bootstrap 3 out of the box.
https://jsonform.github.io/jsonform/playground/index.html
MIT License
2.72k stars 553 forks source link

How to Map My Custom JSON Value to JSON Forms #427

Closed KruteekaMS closed 1 year ago

KruteekaMS commented 1 year ago

I am new to JSONForms. And I'm trying to implement the UI form which will get the Options dynamically and need to set the input value from the value tag. I'm Not finding a way to render the Option/select dynamically.

var JSON_Form= {
   schema:{
      "phone_calendar_integration":{
         "type":"object",
         "properties":{
            "remind_before_minutes":{
               "type":"boolean",
               "title":"Calendar Integration"
            },
            "calendar_name":{
               "title":"Calendar Name: ",
               "type":"string"
            },
            "calendar_fields":{
               "type":"object",
               "properties":{
                  "calendar_wh_clause":{
                     "title":"Any filter that you want to apply:",
                     "type":"string"
                  },
                  "calendar_object":{
                     "title":"Object in Salesforce that you want to Sync Calendar:",
                     "type":"string",
                      "enum":[<Dynamic Option>]
                  },
                  "title":{
                     "title":"Field for title",
                     "type":"string",
                      "enum":[<Dynamic Option>]
                  },
                  "event_id":{
                     "type":"string",
                     "enum":[<Dynamic Option>]
                  },
                  "description":{
                     "title":"Description",
                     "type":"string",
                      "enum":[<Dynamic Option>]
                  },
                  "start_datetime":{
                     "title":"Field for Event Start Date",
                     "type":"string",
                     "enum":[<Dynamic Option>]
                  },
                  "end_datetime":{
                     "title":"Field for Event End Date",
                     "type":"string",
                     "enum":[<Dynamic Option>]
                  }
               }
            }
         }
      }
   }, value : {
   "phone_calendar_integration":{
      "calendar_name":"dftly Tasks",
      "calendar_fields":{
         "start_datetime":"dftlytime__Assigment_Start_Date__c",
         "description":"Name",
         "end_datetime":"dftlytime__Assignment_End_Date__c",
         "title":"dftlytime__dftly_Project__r.Name",
         "event_id":"Id",
         "location":""
      },
      "calendar_object":"dftlytime__dftly_Project_Assignment__c",
      "remind_before_minutes":15,
      "calendar_wh_clause":"dftlytime__Assigment_Start_Date__c >= LAST_N_DAYS:30 and dftlytime__Assignment_End_Date__c <= NEXT_N_DAYS:30 and dftlytime__dftly_Time_Tracker_User__c = '#@#userid#-#'"
} , form:{
      {
         "title":"Calendar",
         "type":"tab",
         "items":[
            {
               "key":"phone_calendar_integration",
               "activeClass":"btn-success",
               "onChange" : function (evt){
                                     var value = $(evt.target).val();
                                     if (value) alert(value);
               }
            }
         ]
      }
   }
}
tchapi commented 1 year ago

Hi,

  1. Please reformat your message so your code is readable
  2. What is your question exactly?
KruteekaMS commented 1 year ago

Hello @tchapi,

I have reformated my code. I just want to know how to create a dynamic option and set the default value(From my Custom JSON).

sdetweil commented 1 year ago

@KruteekaMS what is 'dynamic option'?

defaults are specified in the schema if any actuals are in the value section of the form structure { schema form value }

KruteekaMS commented 1 year ago

@sdetweil Thank you for helping me, "Dynamic option" means UI contains some Select/Dropdown, where the options are filled by API callouts(Get Method) or it can be a Custom JSON array.

sdetweil commented 1 year ago

jsonform doesn't provide any support for realtime form embellishment (adding items to lists, or filling fields). the form is generated once from the information provided.

KruteekaMS commented 1 year ago

@sdetweil Thank you

sdetweil commented 1 year ago

@KruteekaMS can we close this now?

KruteekaMS commented 1 year ago

@sdetweil Yes please ,thanks