title: Can I automatically set a js-GRID text field according to a specific Select value?
body: <p>I know it is not clear but I show you this image:</p>
  
  <p><a href="https://i.stack.imgur.com/60MkJ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/60MkJ.png" alt="Look at here"></a></p>
  
  <p>I want when I select a Data type, to set the DB Data text field according to the following:</p>
  
  <p>Data Type – DB DataType</p>
  
  <p>a.  STRING - varchar(100)</p>
  
  <p>b.  INTEGER – int</p>
  
  <p>c. LONG - Bigint</p>
  
  <p>For example :</p>
  
  <p>1)When I select STRING from Data Type to be able to set the DB Datatype text field to varchar(100) or </p>
  
  <p>2)When I select INTEGER from Data Type to be able to set the DB Datatype text field to int or</p>
  
  <p>3)When I select LONG from Data Type to be able to set the DB Datatype text field to Bigint.</p>
  
  <p>My code is the following:</p>
  
  <pre><code>$("#DataGrid").jsGrid({
                  height: "100%",
                  width: "70%",
                  filtering: true,
                  editing: true,
                  inserting: true,
                  sorting: true,
                  paging: true,
                  autoload: true,
                  pageSize: 15,
                  pageButtonCount: 5,
                  datatype: "json",
                  deleteConfirm: "Do you really want to delete the row?",
                  controller: process_variables,
                  fields: [
                      { name: "ID", align: "center", width: 10 },
                      { name: "Name", validate: { message: "Field Name is required", validator: function(message) { return message; } }, align: "center", type: "text", width: 100 },
                      { name: "Display Name", validate: { message: "Field Display Name is required", validator: function(message) { return message; } }, align: "center", type: "text", width: 100 },
                      { name: "Data Type", validate: { message: "Field Data Type is required", validator: function(value) { return value != ""; } }, align: "center", type: "select", items: process_variables.dataType, valueField: "Name", textField: "Name", width: 45 },
                      { name: "Initial Value", align: "center", type: "text", width: 40 },
                      { name: "Initial State", validate: { message: "Field Initial State is required", validator: function(value) { return value != ""; } }, align: "center", type: "select", items: process_variables.initialState, valueField: "Name", textField: "Name", width: 40 },
                      { name: "Worklist Order", align: "center", type: "number", width: 25 },
                      { name: "DB Datatype", validate: { message: "Field DB Datatype is required", validator: function(message) { return message; } }, align: "center", type: "text", width: 45 },
                      { name: "Allowed values", align: "center", type: "text", width: 100 },
                      { type: "control", width: 25 }
                  ]
  
          });
  </code></pre>
  
  <p>This is my js-GRID database:</p>
  
  <pre><code>(function() {
  
      var total_data_ids = 8;
      var process_variables = {
  
          loadData: function(filter) {
              return $.grep(this.clients, function(client) {
                  return (!filter.ID || client.ID.indexOf(filter.ID) &gt; -1)
                      &amp;&amp; (!filter.Name || client.Name.indexOf(filter.Name) &gt; -1)
                      &amp;&amp; (!filter.Displayed_name || client.Displayed_name.indexOf(filter.Displayed_name) &gt; -1)
                      &amp;&amp; (!filter.Data_type || client.Data_type === filter.Data_type)
                      &amp;&amp; (!filter.Initial_value || client.Initial_value.indexOf(filter.Initial_value) &gt; -1)
                      &amp;&amp; (!filter.Initial_state || client.Initial_state === filter.Initial_state)
                      &amp;&amp; (!filter.Worklist_order || client.Worklist_order === filter.Worklist_order)
                      &amp;&amp; (!filter.process_variables_datatype || client.process_variables_datatype.indexOf(filter.process_variables_datatype) &gt; -1)
                      &amp;&amp; (!filter.Allowed_values || client.Allowed_values.indexOf(filter.Allowed_values) &gt; -1);
              });
          },
  
          insertItem: function(insertingClient) {
              insertingClient.ID = total_data_ids;
              this.clients.push(insertingClient);
              $("#DataJson").html(JSON.stringify(this.clients));
              total_data_ids++;
  
          },
  
          updateItem: function(updatingClient) {
              $("#DataJson").html(JSON.stringify(this.clients));
          },
  
          deleteItem: function(deletingClient) {
              var clientIndex = $.inArray(deletingClient, this.clients);
              this.clients.splice(clientIndex, 1);
              $("#DataJson").html(JSON.stringify(this.clients));
          }
  
      };
  
      process_variables.dataType = [
          { Name: "STRING", Id: 0 },
          { Name: "INTEGER", Id: 1 },
          { Name: "DOUBLE", Id: 2 },
          { Name: "DATE", Id: 3 },
          { Name: "DATETIME", Id: 4 },
          { Name: "BOOLEAN", Id: 5 },
          { Name: "COMMENT", Id: 6 },
          { Name: "FILE", Id: 7 },
          { Name: "EMAIL_ADDRESS", Id: 8 },
          { Name: "AFM", Id: 9 },
          { Name: "ENTITY", Id: 10 },
          { Name: "LONG", Id: 11 }
      ];
  
      process_variables.initialState = [
          { Name: "HIDE", Id: 0 },
          { Name: "READ ONLY", Id: 1 },
          { Name: "WRITE", Id: 2 },
          { Name: "WRITE REQUIRED", Id: 3 }
      ];
  
      process_variables.clients = [];
  
      window.process_variables = process_variables;
  
  }());
  </code></pre>