jquery jqwidgets列表框消失时提交按钮点击

我想了解一些关于jQuery和一些UI小部件（JQWidgets）的工作。我试图调用一个php脚本并以json格式回调一些数据。我知道json格式是正确的，因为如果我直接运行它，我可以获得一个列表框来正确显示和运行。我试图在文本框中输入一个值，当我点击一个提交按钮时，它会将一列数据返回到列表框中。当我点击按钮时，框显示的轮廓消失。我不确定我在做什么。jquery jqwidgets列表框消失时提交按钮点击

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，我关掉了他们使用的跟踪脚本。

来源

2014-07-10 Peter Sun

问题很可能是您的ListBox的高度设置。如果你想以百分比定义高度，你的容器元素也应该与“高度”一起定义，因为默认情况下自动高度的75％将等于0.看看：jQWidgets ListBox with Size in Percentages

来源

2014-07-10 10:37:47 scripto

我改变它们来设定尺寸，但它不起作用。感谢您的建议 –

jquery jqwidgets列表框消失时提交按钮点击

回答

相关问题