jquery - How to two have a field in my pop up editor which is not my grid -


in kendo grid popup editor in need 2 have drop down list mix of(concat somehow) 2 fields in grid,so how can have that?in following want have drop down list shows(model & producer) in pop editor, @ time of saving each part should seat in field

$("#turbingrid").kendogrid({     //   debugger;      datasource: datasource,     scrollable: false,      columns: [               { field: 'deviceip', title: 'deviceip', width: '100px', id: 'deviceip' },               { field: 'producer', title: 'producer', width: '80px', editor: productnamedropdowneditor, },               { field: 'model', title: 'model', width: '220px' },               { field: 'devicetype', title: 'devicetype', width: '100px',editor: devicetypeslist  },               { field: 'description', title: 'description', width: '220px' },               { field: 'username', title: 'username', width: '120px' },               { field: 'password', title: 'password', width: '100px' },               { field: 'publicip', title: 'publicip', width: '120px' },               { field: 'device_id', title: 'device_id', width: '120px',hidden:true },               { command: ["edit"], title: " " }],      editable: "popup",     //edit:     //    function () {     //        document.getelementsbyname("deviceip")[0].disabled = true;      //    },          edit: function(e) {             e.container.find("label[for='device_id']").parent().hide();             e.container.find("div[data-container-for='device_id']").hide();         }                                                                             });

look @ following code. i've used text box instead of drop-down , made crude demo split point more important.

you can use beforeedit event prepare data edit popup , place in new field on model, use new field in template , use save event apply changes made custom field original fields.

<!doctype html>  <html>  <head>      <meta charset="utf-8"/>      <title>kendo ui snippet</title>        <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.common.min.css"/>      <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.rtl.min.css"/>      <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.silver.min.css"/>      <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.mobile.all.min.css"/>        <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>      <script src="https://kendo.cdn.telerik.com/2017.2.621/js/kendo.all.min.js"></script>  </head>  <body>      <script id="popup-editor" type="text/x-kendo-template">    <h3>edit person</h3>    <p>      <label>name:<input name="name" /></label>    </p>    <p>      <label>age: <input type="text" name="test" /></label>    </p>  </script>  <div id="grid"></div>  <script>  $("#grid").kendogrid({    columns: [      { field: "name" },      { field: "age" },      { command: "edit" }    ],    datasource: {      data: [        { id: 1, name: "jane doe", age: 30 },        { id: 2, name: "john doe", age: 33 }      ],      schema: {        model: { id: "id" }      }    },    editable: {      mode: "popup",      template: kendo.template($("#popup-editor").html())    },    beforeedit: function(e) {      e.model.test = e.model.name + ", " + e.model.age.tofixed();    },    save: (e) => {      let values = e.model.test.split(", ");      e.model.name = values[0];      e.model.age = parseint(values[1]);    }  });  </script>  </body>  </html>


Comments

Post a Comment

Popular posts from this blog

html - How to set bootstrap input responsive width? -

Image
i need inline form calendar in both fields. reason can't rid of space between text , borders of input... here picture of problem i've tried set width parent div , input itself.... no good.. here i've done far. fiddle : <div class="modify_search"> <div class="search_wrapper"> <div class="search_header"> <form class="form-inline"> <div class="left"> <span>du</span> <div class="input-group"> <input type="text" class="form-control search_input" id="inlineforminputgroup"> <div class="input-group-addon"> <i class="fa fa-calendar" aria-hidden="true"></i> </div> </div> </div>
Read more

javascript - Highchart x and y axes data from json -

here js fiddle : demo i plotting differences of timestamps in multiple series reading data json. how plot "timestamp","timestamp2","timestamp3" against "tempersensordata" instead of steps? var processed_json = new array(); //ts1 var processed_json1 = new array(); //ts2 // populate initial series (i = 0; < data.length; i++){ processed_json.push(data[i].timestamp/1000); processed_json1.push(data[i].timestamp2/1000); }
Read more

javascript - Get js console.log as python variable in QWebView pyqt -

Image
i'm trying build application creates html + js code python , loads qwebview. the final html + js code following (raw code available here ): <head><meta charset="utf-8" /><script src="https://cdn.plot.ly/plotly-latest.min.js"></script></head><div id="mydiv" style="height: 100%; width: 100%;" class="plotly-graph-div"></div><script type="text/javascript">window.plotlyenv=window.plotlyenv || {};window.plotlyenv.base_url="https://plot.ly";plotly.newplot("mydiv", [{"type": "scatter", "x": [6.81, 6.78, 6.49, 6.72, 6.88, 7.68, 7.69, 7.38, 6.76, 6.84, 6.91, 6.74, 6.77, 6.73, 6.68, 6.94, 6.72], "y": [1046.67, 1315.0, 1418.0, 997.33, 2972.3, 9700.0, 6726.0, 6002.5, 2096.0, 2470.0, 867.0, 2201.7, 1685.6, 2416.7, 1618.3, 2410.0, 2962.0], "mode": "markers", "ids": [0, 1, 2, 3, 4, 5, 6, 7, 8,
Read more