在回发时仅更新页面的一部分

时间:2019-05-27 12:30:38

标签: c# asp.net

我有2个div,一个div具有一个在服务器端运行的html按钮,并将rdlc报表生成到同一页面中另一个div中的reportviewer中。 回发后,整个页面将刷新并清除回发前我已经选择的下拉菜单中的数据。 请从回发生成报表后,如何防止清除下拉菜单和其他控件的值。 UpdatePanel对我不起作用 谢谢

将数据加载到选择下拉列表

$(document).ready(function () {
    //$("#assayreport").tableHeadFixer({ 'foot': true });
    "responsive"; true,
        "serverSide"; true,
            "info"; true,
                "stateSave"; true,
                    $.ajax({
                        url: 'RhemaServices.asmx/GetJobs',
                        data: '{"jobnumber":"","clientID":"0","status":"2"}',
                        type: 'POST',
                        dataType: 'json',
                        contentType: "application/json; charset-utf-8",
                        success: function (data) {
                            jobdatavariable = data
                            $.each(data, function (i, item) {
                                $('<option value="' + item.TotalInvoiceValue + '">' + item.JobNumber + '</option>').appendTo('#jobcard');
                            });
                        },
                        error: function (err) {
                            console.log(err)
                        },
                        complete: function () {
                        }


                    });
});



<div class="col-md-4">
            <div class="box box-primary">
                <div class="box-header">
                   <%-- <h3 class="box-title" id="jobidss" style="color: #3C8DBC;">Job Card Details</h3>--%>
                    <div class="box-tools pull-right">
                        <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                    </div>
                </div>
                <div class="box-body">
                    <div class="col-lg-8">
                        <div class="form-group">
                            <label style="color: red;">Select Job Card </label>
                            <div class=".col-xs-3">
                                <select class="select2  form-control" id="jobcard" name="jobcard" onchange="return getJobNo()">
                                    <option selected="selected"></option>
                                </select>
                            </div>
                        </div>
                        <div style="display: nones;">
                            <span style="float: right">
                                <button id="but_add" class="btn btn-primary fa fa-eye" runat="server" onserverclick="LoadData"> Get Invoice</button></span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

   <div class="col-md-8">
            <div class="box box-info">
                <div class="box-header">
                    <h3 class="box-title" id="jobidS" style="color: #3C8DBC;">Gold Assay Invoice</h3>
                    <div class="box-tools pull-right">
                        <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                    </div>
                </div>
                <div class="box-body" style="display: nones">
                    <form runat="server">
                        <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"></asp:ScriptManager>
                        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                            <ContentTemplate>
                                <rsweb:ReportViewer ID="rv" runat="server" Height="800px" Width="100%" SizeToReportContent="True" ShowBackButton="False" ShowCredentialPrompts="False" ShowDocumentMapButton="False" ShowFindControls="False" ShowParameterPrompts="False" ShowPromptAreaButton="False">
                                </rsweb:ReportViewer>
                            </ContentTemplate>
                        </asp:UpdatePanel>

                        <asp:HiddenField ID="jobnumber" runat="server" />
                    </form>
                </div>
            </div>

        </div>

用于页面加载和按钮单击事件(LoadData)的C#代码

protected void Page_Load(object sender, EventArgs e)
    {
        if(!IsPostBack)
        {

        }
    }
    protected  void LoadData(object sender, EventArgs e)
    {
        rv.ProcessingMode = ProcessingMode.Local;
        rv.LocalReport.ReportPath = Server.MapPath("~/Reports/Invoice.rdlc");
        DataTable dt = GetData();          

        ReportDataSource datasource = new ReportDataSource("DataSet1", dt);

        rv.LocalReport.DataSources.Clear();
        rv.LocalReport.DataSources.Add(datasource);
        rv.LocalReport.Refresh();

    }

1 个答案:

答案 0 :(得分:0)

因此,您已经通过ajax jquery绑定了Dropdown,在这种情况下,每次您发布回jquery的$(document).ready(){}事件都会触发,并且您的dropdown再次填充值并重置其值,因此对于解决方案,您可以做的只是按C#中的代码在页面加载事件后面绑定下拉列表。尝试以下代码。

protected void Page_Load(object sender, EventArgs e)
{
    if(!IsPostBack)
    {
       jobcard.DataSource=dtJobCard;//get data in this dtJobCard using DB or from wherever you want to get
       jobcard.DataTextField="JobNumber";
       jobcard.DataValueField="TotalInvoiceValue"; 
       jobcard.DataBind();
    }
}

并使ASP.NET Dropdown控件在aspx代码中像这样更改它。

<asp:DropDownList ID="jobcard" runat="server">  
    </asp:DropDownList> 

更新 如果这是要求,则可以执行以下操作。 将值存储在隐藏字段中,然后检查隐藏字段中是否有值,如果是,则填充ddl并设置值,否则不执行任何操作。下面是完整的代码。 更改脚本代码

    $(document).ready(function () {

        //$("#assayreport").tableHeadFixer({ 'foot': true });
        "responsive"; true,
            "serverSide"; true,
                "info"; true,
                    "stateSave"; true,
                        $.ajax({
                            url: 'RhemaServices.asmx/GetJobs',
                            data: '{"jobnumber":"","clientID":"0","status":"2"}',
                            type: 'POST',
                            dataType: 'json',
                            contentType: "application/json; charset-utf-8",
                            success: function (data) {
                                jobdatavariable = data
                                $.each(data, function (i, item) {
                                    $('<option value="' + item.TotalInvoiceValue + '">' + item.JobNumber + '</option>').appendTo('#jobcard');
                                });
                            },
                            error: function (err) {
                                console.log(err)
                            },
                            complete: function () {
                            }


                        });
            if($('#jobnumber').val()!="")
             {
                $('#jobcard').val($('#jobnumber').val());
             }
    });

创建onchange函数  像这样

function getJobNo()
{
   $('#jobnumber').val($('#jobcard').val());
}

综合而言,我可能错了,但是这种逻辑应该起作用。