Передача переменной в другую функцию (jeasyui)

Question

Здравствуйте,. Я отчаянно пытался передать переменную между функциями, я попробовал некоторые решения, но они не сработали - возможно, я делаю это неправильно. У меня нет идей, как это можно решить, для некоторых из вас может быть тривиальным, с нетерпением жду помощи.

Как это работает?: Входные радиоприемники должны добавить параметр в url (queryParams - все должно быть в порядке в соответствии с документацией), я называю это дополнительным фильтром для отображения указанных данных. Когда вы нажимаете радиоприемник, получает значение и должен присоединяться к запросуParams.

Если у вас есть дополнительные вопросы, не стесняйтесь спрашивать.

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

Answer 1

Одним из решений является просто позвонить .datagrid еще раз.

$("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 
 
     } 
 
    }); 
 
}

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