使用jqGrid具有不同选项的单列选择框

有一个网格需要在同一列中具有不同选项值的选择框。例如，在试图解决这个问题的测试网格中，概念是使用选择框从电影中选择一个演员。每行都有不同电影的数据。在每一行内，actors列都有一个不同的actor列表，这些列表需要用来动态填充该行的选择框。演员名单设置为CSV，逗号分隔值，在数据库中：I.E.，Clint Eastwood，Tom Cruz，Vin Diesel。使用jqGrid具有不同选项的单列选择框

从测试完成后，看起来像一旦建立了列模型，它只在每个网格加载时执行一次，这意味着您只能获得列中所有选择框的一组选项。通过设置一个循环块，在填充网格的php文件（在本例中为myfirtgridajax.php）中生成适当的代码并将其显示为功能时，已成功将具有所需值的html字符串作为返回数据传递给网格用正确的价值观选择框，它不会那样做是在列模型时置一个选择框使用

{... edittype:select, edit options:{value:{CE:'Clint Eastwood'... }}}

我们需要的是，生成一个POST请求的onChange或具有相同的结果的东西，从选择框将在数据库中设置另一个值。也就是说，如果选择了Clint Eastwood，则需要生成POST请求以将该值传递给另一个php页面进行处理。

我的问题是，虽然看起来像通过传递一个HTML字符串创建的选择框上的黑客设置事件侦听器，是否有更好的方法来做到这一点？

<script> 
$(function() { 
    $('#displayresultstable').jqGrid({ 
     url:'../gridcalls/myfirstgridajax.php', 
     datatype:'json', 
     mtype: 'GET', 
     colNames:['ID', 'movie', 'topic', 'rating','actors'], 
     colModel :[ 
      {name:'ID', index:'ID', width:50}, 
      {name:'movie', index:'movie', width:200, editable:true}, 
       {name:'topic', index:'topic', width:350, editable:true}, 
      {name:'rating', index:'rating', width:50, editable:true }, 
      {name:'actors', index:'actors', width:350, editable:true }, 
     ], 
     pager: '#pager', 
     rowNum:10, 
     height: 'auto', 
     rowList:[5,10,15], 
     sortname:'ID', 
     sortorder: 'desc', 
     viewrecords: true, 
     gridview: true, 
     cellEdit: true, 
     cellurl:'../editfirstgridajax.php', 
     caption: 'Movie Greats' 
    }); 
    $('#displayresultstable').jqGrid('navGrid','#pager', {view: true}); 
}); 
</script> 

<table id='displayresultstable'> 
    <tr><td></td></tr> 
</table> 

<div id='pager'></div>

感谢

来源

2013-05-17 user1649798

还是想非黑客的解决方案，但已经提出了一个可行的黑客。

您所做的是在AJAX调用页面中设置一个条件块，用于生成HTML对象，在这种情况下，选择框由来自actors列的数据填充。使用PHP爆炸（'，'，$ myarray）来解析数据和一个循环来设置选择选项。然后添加事件处理程序所需的JavaScript以传递选定的值并调用另一个JavaScript函数，以将数据（我正在使用POST）传递到另一个PHP页面来更新数据库。有了这些，我用单元格（对于给定行）或列（查看整个网格）的行json值替换了HTML字符串。

在columnModel上，必须删除可编辑：true。另外，用户可以点击一个或两个不能被选择按钮隐藏的像素的边缘/填充空间，而不管我给出的选择框的高度属性如何，这导致显示HTLM字符串在那个小区里。此外，您需要将所有JavaScript放在与选择框相同的代码行上，我使用了一个变量设置为在我的条件块中生成的HTML字符串，否则网格会添加换行符，或者更确切地说，看起来像行换行符选择框放置在表格单元格中。这会导致网格单元格的高度增加。

$responce->rows[$i]['cell']=array($row['ID'],$row['movie'], $row['topic'],$row['rating'],'<select id="actors'.$i.'"style="width:100%;"><option value="what the'.$therowid.'">ed</option><option value="zed">zed</option><option value="red">red</option></select><script>$("#actors'.$i.'").change(function(){var actorselected =$("#actors'.$i.' option:selected").val();alert("you changed select box actors'.$i.' with record id '.$therowid.'\nThe selected value is "+actorselected);});/script>');

上面的代码是从静态尽量不要使用DB，但并展示它是如何工作。

来源

2013-05-22 15:39:09 user1649798

使用jqGrid具有不同选项的单列选择框

回答

相关问题