如何动态设置grid post param并使用新URL触发重新加载?

时间:2018-01-10 17:44:28

标签: javascript jquery jqgrid free-jqgrid

我有以下jQgrid Free(版本:4.15.2)定义:

$(document).ready(function () {
    var $load_form = $("#load_form"),
        $form_id = sessionStorage.getItem('form_id') === null ? 1 : sessionStorage.form_id,
        $questions_grid = $("#questions");

    $(document).on("click", $load_form, function (ev) {
        // get the new form_id value and reload the grid by passing 
        // the new form_id as post parameter for the AJAX request
    });

    $questions_grid.jqGrid({
        url: '/ajax/questions/get/' + $form_id,
        datatype: "json",
        colNames: ['id', 'grid_id', 'seq', 'type', 'text'],
        colModel: [
            {name: 'field_id', index: 'id', width: 100, editable: false, editoptions: {readonly: true, size: 10}},
            {name: 'grid_id', index: 'grid_id', width: 50, editable: false, editoptions: {readonly: true, size: 10}},
            {name: 'field_seq', index: 'seq', width: 45, editable: true, editoptions: {size: 10}},
            {name: 'type', index: 'type', width: 125, editable: false, editoptions: {readonly: true, size: 10}},
            {
                name: 'field_name',
                index: 'text',
                width: 585,
                editable: true,
                edittype: "textarea",
                editoptions: {rows: "5", cols: "45"}
            }
        ],
        autowidth: true,
        iconSet: "fontAwesome",
        rowNum: 100,
        guiStyle: "bootstrap",
        pager: 'questions_pager',
        pgbuttons: false,
        pginput: false,
        sortname: 'seq',
        viewrecords: true,
        caption: "Questions",
        width: 100,
        height: "auto",
        editurl: 'ajax/questions/edit',
        multiselect: true,
        subGrid: false,
        subGridUrl: 'ajax/questions/get_options',
        subGridModel: [{name: ['id', 'text', 'is required'], width: [55, 200, 20]}],
        gridComplete: function () {
            // Don't need the +1 because it includes ".jqgfirstrow"
            var seq_number = this.rows.length;
            $("#next_seq_num").val(seq_number);

            $("#field_seq").empty();
            $("#grid_field_seq").empty();
            for (var i = 1; i <= seq_number; i++) {
                var sel = (i == seq_number) ? 'selected' : null;
                $("#field_seq").append("<option " + sel + ">" + i + "</option>");
                $("#grid_field_seq").append("<option " + sel + ">" + i + "</option>");
            }

            $(window).trigger('resize');
        },
        onSelectRow: function (ids) {
            if (ids !== null) {
                $("#option_field_id").val(ids);
                $(".field_seq_section").hide();

                $.ajax({
                    type: "POST",
                    url: "ajax/questions/get_grid_example/" + ids,
                    success: function (msg) {
                        if (msg !== "") {
                            jQuery('#options_ids').empty();
                        }

                        jQuery('#grid_cells_example').html(msg);
                    }
                });

                edit_question("<?php echo site_url('ajax/questions/get_by_id') ?>/" + ids, false);
            }
        }
    }).jqGrid('hideCol', 'cb');
});

在某些时候我动态设置data-formid的属性$("#load_form")的值。由于$("#load_form")是一个按钮(请参阅下面的定义),因此我想使用新的reloadGrid值触发$formid事件,以便从数据库中获取新的新数据。

<button type="submit" class="btn btn-default" data-formid="" id="load_form">
   Load form
</button>

通过几个合乎逻辑的步骤:

  • 设置data-formid
  • 的值
  • 点击按钮
  • 使用reloadGrid
  • 触发$("#load_form").data("formid")

我发现了这个:how to set postData in jqgrid AFTER it has been constructed?但我不确定如何申请我的场景。

我怎么能做到这一点?

1 个答案:

答案 0 :(得分:0)

如果我理解正确,您想要更改url参数。 click-event处理程序的代码可能接近以下内容:

$(document).on("click", $load_form, function (ev) {
    var p = $questions_grid.jqGrid("getGridParam");
    p.url = "/ajax/questions/get/" + $("#load_form").data("formid");
    $questions_grid.trigger("reloadGrid");
});
相关问题