加载div而不刷新asp.net中的页面

时间:2016-10-28 11:43:24

标签: javascript jquery html asp.net ajax

我正在使用不同的html页面内容动态加载弹出窗口div。 HTML页面控件成功依赖于div但问题是,在使用$("#middlepart").load()加载内容期间整个页面都在刷新 我想重新加载内容而不刷新asp.net中的页面。 代码如下:

 <div class="popmiddlepart">
                <div class="type-benifit">
                    <div class="subdivOne">
                        <div class="fl-lt">
                            <label>Type of Benefit</label>
                        </div>
                        <div class="fl-lt">
                            <div id="ddlBenefitType" >
                            </div>

                        </div>
                        <div class="clearfix"></div>
                        <hr style="margin-bottom: 10px; margin-top: 10px;">
                    </div>
                </div>


                <div id="relate-message-box-html" style="display: none">
                    <i class="fa fa-info-circle" aria-hidden="true" style="color: red;"></i><strong></strong>
                    <span id="spnToolTipTexthtml"></span>
                </div>

                <div class="clearfix"></div>
                <div id="middlepart" class="dynamic-content">
                    <div class="middle-part">
                        content goes here
                    </div>
                </div>

             </div>

我正在更新调用dropdown onchange事件的div

  $("#ddlBenefitType").relateSelectControl({
            selectControlDataSource: benefittypedata,
            dataValueField: 'id',
            dataTextField: 'text',

            onchange: function (e) {
                e.preventDefault();
                var selectedtype = $("#ddlBenefitType").getSelectControlText();

                if (selectedtype == 'Accommodation') {
                    var key = getQueryStringValue('id');
                    $("#middlepart").load(baseUrl + "employee/accomodationdetails_ie.html?id=" + key);
                }

                if (selectedtype == 'Loan') {
                    var key = getQueryStringValue('id');
                    $("#middlepart").load(baseUrl + "employee/loandetails_ie.html?id=" + key);
                }
            }
        });

1 个答案:

答案 0 :(得分:1)

试试$.get()。它是进行jquery ajax调用以从外部源异步加载html的简写。

这样的事情应该有效:

$.get( baseUrl + "employee/accomodationdetails_ie.html?id=" + key, function( data ) {
    $( "#middlepart" ).html( data ); 
});