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的高度设置。如果要以百分比定义高度，则容器元素也应定义为“height”，因为默认情况下自动高度的75％将等于0.请查看：{{3} }

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

1 个答案: