php - JQueryと一緒にURLの別のフォームから値を渡す方法は?

Question

Mysqlデータベースからのデータを表示するためのJquery jtableプラグインもあるphpページに別のフォームがあります。フォームにはドロップダウン リスト ボックスがあります。これらのドロップダウンからの値を、URL の Jtable アクション List と一緒に渡して、ドロップダウンから選択した条件に関してテーブルをリストする必要があります。

   <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 である行のみを表示する必要があります。

URL で値を渡すことができるように、Jtable コンテナー内のフォーム値にアクセスする必要があります。

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

送信ボタンを押すと、リストの URL にもマシンの値が含まれているはずです。

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

Jqueryで可能ですか？

私はこのようにしてみました

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

クロムで次のエラーが表示されます

    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');