Fatal编程技术网
  • asp.net/
  • Asp.net 如何在jqueryui上填充占位符单击

Asp.net 如何在jqueryui上填充占位符单击

asp.net jquery-ui

Asp.net 如何在jqueryui上填充占位符单击,asp.net,jquery-ui,Asp.net,Jquery Ui,我在单击jqueryui时加载占位符时遇到问题。我已经从后端填充了。我需要根据accordin标题单击填充占位符 这是我的html <html> <head> <script> $(function () { $('#login').button({ icons: { primary: "ui-icon-person"} }); $('#showDataSource').button({ icons: { pr

我在单击jqueryui时加载占位符时遇到问题。我已经从后端填充了。我需要根据accordin标题单击填充占位符

这是我的html

<html>
<head>
    <script>

    $(function () {
        $('#login').button({ icons: { primary: "ui-icon-person"} });
        $('#showDataSource').button({ icons: { primary: "ui-icon-newwin"} });
        $('#logout').button({ icons: { primary: "ui-icon-locked"} });

        $('#login').click(function () {

            var panel = $('#loginPanel').dialog({ modal: true });
            panel.parent().appendTo($("form:first"));
        });

        $('#logout').click(function () {
            (function (event) {

            });
        });

        $('#showDataSource').click(function () {
            $('#dataSource').dialog({ modal: true, width: 1000, height: 700 });
            $('.accordion').accordion({ autoHeight: false, navigation: true, collapsible: true,
                active: false,
                changestart: function (event, ui) {
                    var dataSourceID = ui.newHeader.find('a').attr('id');
                    //var dataSourceColumn = EasyOutputWeb.Services.GetDataSourceColumns(dataSourceID, onsuccess, onError);
                    $.post(dataSourceID, function (data) {

                        //ui.newHeader.next("div").html(dataSourceID);
                        $('#columnPlaceHolder').html(dataSourceID);
                    });
                }
            });
        });
    });

    function onsuccess(msg) {
        alert(msg);
    }
    function onError(msg) {
        alert(msg);
    }

    </script>

</head>

<body>
        <div id="dataSource" runat="server">  
                <div class="divtable">  
                    <div class="headrow" id="#accordianHeight">  
                        <div class="divcol">  
                            Data Sources</div>  
                        <div class="divcol" >  
                            Columns</div>  
                        <div class="divcol">  
                            Strong Keys</div>  
                    </div>  
                    <div class="divrow">  
                        <div class="content">  
                            <div class="accordion" id="accordianHeight">  
                                <asp:PlaceHolder ID="dataPlaceHolder" runat="server" />  
                            </div>  
                        </div>  
                        <div class="content">  
                            <div id="dataColumn">  
                                test column  
                                <asp:PlaceHolder ID="columnPlaceHolder" runat="server" />  
                            </div>  
                        </div>  
                        <div class="content" >  
                            <div id="dataKey">  
                                Test key  
                                <asp:PlaceHolder ID="keyPlaceHolder" runat="server" />  
                            </div>  
                        </div>  
                    </div>  
                </div>  
            </div>  

</body>
</html>


$（函数（）{
$（'#login'）。按钮（{icons:{primary:{ui-icon-person}}）；
$（'#showDataSource'）。按钮（{icons:{primary:{ui icon newwin}}）；
$（'#注销'）。按钮（{icons:{primary:{ui icon locked}}）；
$（“#登录”）。单击（函数（）{
变量面板=$（'loginPanel'）。对话框（{modal:true}）；
panel.parent（）.appendTo（$（“form:first”）；
});
$（“#注销”）。单击（函数（）{
（功能（事件）{
});
});
$（'#showDataSource'）。单击（函数（）{
$（#dataSource'）。对话框（{model:true，宽度：1000，高度：700}）；
$（'.accordion'）.accordion（{autoHeight:false，导航：true，可折叠：true，
活动：错误，
changestart：功能（事件、用户界面）{
var dataSourceID=ui.newHeader.find（'a'）.attr（'id'）；

//var dataSourceColumn=EasyOutputWeb.Services.GetDataSourceColumns（dataSourceID、onsuccess、onError）；
$.post（数据源ID，函数（数据）{
//ui.newHeader.next（“div”）.html（数据源ID）；
$（'#ColumnPocholder'）.html（数据源ID）；
});
}
});
});
});
函数onsuccess（msg）{
警报（msg）；
}
函数onError（msg）{
警报（msg）；
}
数据源
柱
强键
试验柱
测试密钥
这里的第一个错误是您使用了占位符
，因此jQuery无法获取它们。使用
面板
使内容的跨度或div发生扭曲

第二个错误是，当asp.net呈现它们时，每个对象的最终id都是从
.ClientID
属性获取的，因此jQuery的代码如下：


$('#<%=columnPlaceHolder.ClientID%>').html(dataSourceID);



$（'#'）.html（数据源ID）；



还有一条评论，如果你没有在
面板
上添加任何关于代码隐藏的控件，那么你只需放置一个
代码来编写它们，然后像现在一样使用jQuery调用（不要添加CliendID）
非常感谢，这很有效。但是我的方法没有返回任何结果集。非常感谢，它很有效。但是我的方法没有返回任何结果集。这是我的方法var dataSourceColumn=EasyOutputWeb.Services.GetDataSourceColumns（dataSourceID，onsuccess，onError）；我是从asmx文件打来的。[WebMethod（EnableSession=true）][ScriptMethod]public string[]GetDataSourceColumns（string dataSourceId）{//通过执行一些操作并返回名称数组，我可以通过使用警报返回名称在onsuccess（msg）中看到结果。ToArray（）；@user1557020这是第二个问题。真的不明白这是什么问题。//var dataSourceColumn=EasyOutputWeb.Services.GetDataSourceColumns（dataSourceID，onsuccess，onError）这是我从webservice调用的方法，它返回数组字符串，我想把这个数组字符串绑定到我的div列“columnpocholder”。