jquery jqwidgets列表框消失時提交按鈕點擊

Question

我想了解一些關於jQuery和一些UI小部件（JQWidgets）的工作。我試圖調用一個php腳本並以json格式回調一些數據。我知道json格式是正確的，因爲如果我直接運行它，我可以獲得一個列表框來正確顯示和運行。我試圖在文本框中輸入一個值，當我點擊一個提交按鈕時，它會將一列數據返回到列表框中。當我點擊按鈕時，框顯示的輪廓消失。我不確定我在做什麼。

JavaScript代碼：

<script type="text/javascript"> 
$(document).ready(function() { 
    //create jqxButton widget 
    $("#btnSubmit").jqxButton({ width: '150'}); 
    //create jqxListBox widget 
    $("#btnSubmit").bind('click', function() { 
     //Do som 

     var textValue = $("#txtSearch").val(); 

     var url = "include/showsearch.php?show_name='" + textValue + "'"; //returns json data 
     var source = 
      { 
       datatype: "json", 
       datafields: [ 
        { name: 'name' }, 
        { name: 'id' } 
       ], 
       url:url 
      }; 
     var dataAdapter = new $.jqx.dataAdapter(source); 
     dataAdapter.dataBind(); 
     //crate jqxList widget 
     $("#search_grid").jqxListBox({source: dataAdapter,selectedIndex: 0,theme:'classic',displayMember: "name", valueMember:"id",itemHeight:70,height:'75%',width:'100%'}); 
    }); 
}); 

部分HTML：

<div id="content1"> 

     <form id="search"> 
    <label for="search">Search For:</label> 
    <input type="text" id="txtSearch" name="q"> 
      <input style='margin-top: 20px;' type="submit" value="Search" id="btnSubmit"/> 
</form> 
<div id="search_grid"> 
</div> 
<div style="font-size: 13px; font-family: Verdana;" id="selectionlog"> 
</div> 
</div> 
    <div id="content2"> 
      <div id="dl_grid"> 
</div></div> 

在此先感謝。

編輯：我也想提一下，我使用000webhost，我關掉了他們使用的跟蹤腳本。

Answer 1

問題很可能是您的ListBox的高度設置。如果你想以百分比定義高度，你的容器元素也應該與「高度」一起定義，因爲默認情況下自動高度的75％將等於0.看看：jQWidgets ListBox with Size in Percentages