在视图状态上保留数据并中继到Knockout.JS

Question

I'm currently working on an asp.net web form that uses Knockout, Bootstrap, and JQuery. I'm having an issue with data persistence through "Wizard steps."

What I would like to do is take in the mailing state of the client and persist it through to other pages, from there use Knockout to make fields visible and also create validation.

I've read that you can use hidden states to accomplish this but I've had issues getting the value to pass to Knockout and ultimately getting the other fields to show.

Here is the c# that does all the steps page to page.

    protected void StepChanged(object sender, EventArgs e)
    {
        if (IsPostBack)
        {
            if (QuoteWizard.ActiveStepIndex == 0)
                txtFirstName.Focus();

            if (QuoteWizard.ActiveStepIndex == 1)
            {
                Session["State"] = ddlState.Value;
                rblMailAddr.Focus();
            }

            if (QuoteWizard.ActiveStepIndex == 3)
            {
                txtDriverFName1.Value = txtFirstName.Value;
                txtDriverMI1.Value = txtMI.Value;
                txtDriverLName1.Value = txtLastName.Value;

                String DOB;
                DOB = Convert.ToDateTime(txtDOB.Value).ToString();
                txtDriverDOB1.Value = DOB;

                txtDriverFName1.Focus();
            }

I find it odd that the txtDriverFName1.Value = txtFirstNAme.Value; passes properly but I can't get the state from a drop down list or the date of birth to pass from one step to the other.

   <select id="ddlState" runat="server" class="form-control" data-bind="value: MailState, updateValue: 'afterkeydown'">

Followed by the list of states, then I try to pass it to knockout to make fields visible:

    self.MailState = ko.observable("", { persist: "MailState" });

However, once I reach the next step the values in the ViewState are dropped and

    <div class="btn-group" data-toggle="buttons" style="padding-left: 10px" data-bind="visible: MailState() == 'CA'">

no longer becomes visible even when CA is selected in the previous viewstate.

So how would I persist the value of my drop down list through 2 or more steps in the QuoteWizard.ActiveStepIndex and have that assigned to "MailState()" subsequently activating Knockout?

Answer 1

in data-bind the bindinghandler handle to excute expression, then visible bindinghandler will unwrap it to value from observable. But in your code you use

data-bind="visible: MailState == 'CA'" //MailState is observalbe then like function() == 'CA' - that not right

should change to:

data-bind="visible: MailState() == 'CA'"