Question

我在php页面中有一个单独的表单，它还有Jquery jtable插件来显示来自Mysql数据库的数据。表单有一个下拉列表框。我必须将这些下拉列表中的值与url中的Jtable操作列表一起传递到列表中，该列表与下拉列表中选择的条件相关。

   <div id="machinelog">
    <form id="intermediate" name="inputMachine" method="post">
    <select id="selectMachine" name="selectMachine"> 
        <option value="M1" >Machine 1</option>
        <option value="M2" >Machine 2</option>
        <option value="M3" >Machine 3</option>
    </select>  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;


<input id="Button" class="button" type="submit" value="Submit" />
</form>

如果我从下拉列表中选择机器1，我必须使jtable只显示机器为机器1的行。

我必须访问Jtable容器中的表单值，以便我可以在url中传递这些值。

   <div id="MachineLogTableContainer" style="width: 1000px; margin-left: 254px;margin-top: -440px;position: static;"></div>
    <script type="text/javascript">

        $(document).ready(function () {
            //var s=$('#selectMachine').val();
            //alert(s);
            var machineLogMessages = {
                    addNewRecord: '+ New Machine Log'
                };

            //Prepare jTable
            $('#MachineLogTableContainer').jtable({
                messages:machineLogMessages,
                title: 'Machine Log',
                paging: true, //Enable paging
                pageSize: 10,
                actions: {
                    listAction: 'MachineLogActions.php?action=list',
                    createAction: 'MachineLogActions.php?action=create',
                    updateAction: 'MachineLogActions.php?action=update',
                    deleteAction: 'MachineLogActions.php?action=delete'
                },
                fields: {
                    event_id: {
                        key: true,
                        edit: false,
                        title: 'Event Id',
                        width: '5.8693%',
                        create:false,
                        edit:false,
                        list: false
                    },
                    event_type: {
                        title: 'Event Type',
                        width: '9%',
                        options: 'MachineLogActions.php?action=list_type'
                    },
                    machine: {
                        title: 'Machine',
                        width: '16%',
                        options: 'MachineLogActions.php?action=list_name'
                    },
                    user: {
                        title: 'User',
                        width: '11%',
                        options: 'MachineLogActions.php?action=list_user'
                    },
                    timestamp: {
                        title: 'Timestamp',
                        width: '15%'
                    },
                    shift: {
                        title: 'Shift',
                        width: '9%',
                        options: 'MachineLogActions.php?action=list_shift'
                    },
                    reason: {
                        title: 'Reason',
                        width: '25%',
                        options: 'MachineLogActions.php?action=list_reason'
                    },
                    count: {
                        title: 'Count',
                        width: '3%'
                    }
                }
            });

            //Load person list from server
            $('#MachineLogTableContainer').jtable('load');

        });

    </script>

一旦我按下提交按钮，我的列表网址也应该包含机器值。

        listAction: 'MachineLogActions.php?action=list&MachineId=',+machineId

在Jquery中是否可行？

我试过这个

    var s=$('#selectMachine').val();
alert(s);

我在Chrome中遇到以下错误

    Uncaught SyntaxError: Unexpected token ,

Answer 1

尝试删除逗号？

listAction: 'MachineLogActions.php?action=list&MachineId='+machineId

而不是

listAction: 'MachineLogActions.php?action=list&MachineId=',+machineId

Answer 2

这件事解决了我的过滤问题。

            select = document.getElementById("selectShift");
            select.onchange = function(){
                //alert(this.value); 
                //alert(this.innerHTML); 
            var options = this.getElementsByTagName("option");
            optionHTML = options[this.selectedIndex].innerHTML;  

            $('#ShiftLogTableContainer').jtable('load', {
                ShiftId: optionHTML
                });
            };

你应该添加它而不是

  $('#MachineLogTableContainer').jtable('load');

如何从URL中的单独表单传递值与JQuery一起？

2 个答案: