jQuery X可编辑更新下拉列表

Question

我想使用x-editable编辑下拉列表（select）的每个元素。

<div style="margin: 150px">
  <select id="list1">
    <option value="1">test1</option>
    <option value="2">test2</option>
  </select>
</div>

$('#list1').editable({
  success: function(response, newValue) {
    console.log("response: "+response+' val: '+newValue);
  }
});

似乎x-editable合并了字符串中的所有选项。当选择一个选项时，x-editable会显示所有选项。这里newValue =“test1 test2”。

有没有办法让x-editable能够编辑选择中的每个选项？

=＆GT; http://jsfiddle.net/

THX！

Answer 1

首先，您需要一个服务器端脚本来保存已编辑的值。

your_saving_script.php

如果您手动设置值，则可以执行以下操作：

$('#list1').editable('http://www.example.com/your_saving_script.php', {
     data   : " {'1':'Test 1','2':'Test 2', 'selected':'1'}",
     type   : 'select',
     submit : 'OK'
 });

如果要从服务器端获取数据，则需要一个脚本来获取数据：

your_json.php

服务器端脚本

<?php
 /* http://www.example.com/your_json.php */
 // fetch data from database and return the values in the array
 $array['1'] =  'Test 1';
 $array['2'] =  'Test 2';
 $array['selected'] =  '1';
 echo json_encode($array);
 ?>

和

$('#list1').editable('http://www.example.com/your_saving_script.php', {
     loadurl : 'http://www.example.com/your_json.php',
     type   : 'select',
     submit : 'OK'
 });