Question

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

从测试结果来看，一旦设置了列模型，它就会在每次网格加载时执行一次，这意味着您只能为列中的所有选择框获取一组选项。通过设置循环块以在填充网格的php文件中生成正确的代码（在本例中为myfirtgridajax.php），并且显示为函数选择具有适当值的框，它的行为不像使用

在列模型中设置的选择框

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

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

我的问题是，虽然看起来像是通过传递html字符串创建的选择框上的hack设置事件侦听器可行，但有更好的方法吗？

<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>

由于

Answer 1

仍然想要一个非黑客解决方案，但已经提出了一个有效的黑客攻击。

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

在columnModel上，您必须删除editable：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>');

以上代码来自静态尝试，不使用数据库，但确实演示了它是如何工作的。

单列选择框，使用jqGrid提供多种选项

1 个答案: