将变量传递给其他函数(jeasyui)

时间:2014-10-15 16:37:59

标签: javascript jquery jeasyui

你好,我一直在拼命尝试在函数之间传递一个变量,我尝试了一些解决方案,但是它们没有用 - 也许我做错了。我不知道如何解决这个问题,对于你们中的一些人来说这可能是微不足道的,期待一个帮助。

它是如何工作的:输入无线电应该在url中添加一个参数(queryParams - 根据文档都应该没问题),我称之为额外的过滤器来显示指定的数据。当您单击一个无线电脚本获取该值并应将其附加到queryParams。

如果您有更多问题,请不要犹豫。

<div class="adv_filter">
    <li>
        <input type="radio" name="letter_type" data-custom="Radio1" value="0">Radio1</li>
    <li>
        <input type="radio" name="letter_type" data-custom="Radio2" value="1" checked="checked">Radio2</li>
    <li>
        <input type="radio" name="letter_type" data-custom="Radio3" value="2">Radio3</li>
</div>

$("li").on("click", "input", function () {
    $('#dg').datagrid('reload'); //reloads the grid
    alert($(this).val()); //gets the value of input type radio
    globalVar = $(this).val(); //assign the value to a global variable
    $('#string').html(globalVar);
});

$('#dg').datagrid({

    url: 'data_loader.php',
    queryParams: { //this adds to the url ?ltype=valur
        ltype: globalVar //assign the global variable here
    }
});
//$('#string2').html(globalVar);

JSFiddle example

1 个答案:

答案 0 :(得分:2)

一种解决方案是再次呼叫.datagrid

&#13;
&#13;
$("li").on("click", "input", function () {
    var val = $(this).val();
    $('#string').html(val);
    updateDataGrid(val);
});

updateDataGrid();   // this initial call may or may not be needed. 
                    // if the grid should load something on start up
                    // then pass a parameter to it here.

function updateDataGrid(query) {
    $('#dg').datagrid({

        url: 'data_loader.php',
        queryParams: { 
            ltype: query 
        }
    });
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
<link href="http://www.jeasyui.com/easyui/themes/default/easyui.css" rel="stylesheet"/>

<hr>Filter
<hr>
<div class="adv_filter">
    <li>
        <input type="radio" name="letter_type" data-custom="Radio1" value="0">Radio1</li>
    <li>
        <input type="radio" name="letter_type" data-custom="Radio2" value="1" checked="checked">Radio2</li>
    <li>
        <input type="radio" name="letter_type" data-custom="Radio3" value="2">Radio3</li>
</div>
<hr>
<table class="easyui-datagrid" id="dg" title="Basic DataGrid" style="width:700px;height:250px" data-options="singleSelect:true,collapsible:true">
    <thead>
        <tr>
            <th data-options="field:'itemid',width:80">Item ID</th>
            <th data-options="field:'productid',width:100">Product</th>
            <th data-options="field:'listprice',width:80,align:'right'">List Price</th>
            <th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
            <th data-options="field:'attr1',width:250">Attribute</th>
            <th data-options="field:'status',width:60,align:'center'">Status</th>
        </tr>
    </thead>
</table>
<hr>
<!-- debug -->inside
<div id="string"></div>
<hr>outer
<div id="string2"></div>
&#13;
&#13;
&#13;