We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Strongly typed view does not return model values to controller upon submit of the form

Thread ID:

Created:

Updated:

Platform:

Replies:

124152 May 20,2016 01:28 PM UTC Jun 1,2016 06:26 AM UTC ASP.NET MVC 6
loading
Tags: DropDownList
Tom Frajer
Asked On May 20, 2016 01:28 PM UTC

Hi,
Im using strongly typed helpers for all the fields on my View. Im combining SyncFusion helpers with standard MVC helpers to achieve this.
Then I want to get all the field values in my controller usinf scaffolding method described here: https://www.syncfusion.com/kb/5427/how-to-get-the-form-control-values-in-postback

Unfortunaltely, only values for standard MVC fields are passed back to controller after submit of the form. All Syncfusion form fields have their values not present in the model passed back to my controller (see attached screenshot).

     

Controller:


   public ActionResult TickingEdit(int nl_id)
        {
            TickingViewModel model = new TickingViewModel();

            // Get Ticking Ad details
            model.ticker = tickerService.GetTickerById(nl_id);

            // Load all enumerations for DropDown fields
            model.bodyTypes = tickerService.GetAllBodyTypes();
            model.conditions = tickerService.GetAllConditions();
            model.carMakes = tickerService.GetAllCarMakes();
            model.carModels = tickerService.GetAllCarModels();
            model.countries = tickerService.GetAllCountries();
            model.customerTypes = tickerService.GetAllCustomerTypes();
            model.fuelTypes = tickerService.GetAllFuelTypes();
            model.kmRanges = tickerService.GetAllKmRanges();
            model.segments = tickerService.GetAllSegments();

            // Render Form
            return View("TickingEdit", model);
        }

        [HttpPost]
        public ActionResult TickingEditSubmit(TickingViewModel model)
        {
            // Save ticking Ad form data 
            tickerService.SaveTicker(model.ticker);

            // Go back to listing grid
            return RedirectToAction("TickingGrid");
        }

View:


<script src="~/Scripts/ej/ej.web.all.min.js"></script>
<script src="~/Scripts/ej.data.min.js"></script>
@{
    ViewBag.Title = "CarDat 2 - Ticking";
}

@model CarDat.Web.ViewModels.TickingViewModel

<br />

@using (Html.BeginForm("TickingEditSubmit", "Ticking", FormMethod.Post))

{

    <div class="row">
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label " for="nl_id">Link na inzerát<span class="asteriskField">*</span></label>
                @Html.TextBoxFor(model => model.ticker.s_url_link, new { @class = "e-textbox" })
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="s_url_domain">Doména</label>
                @Html.TextBoxFor(model => model.ticker.s_url_domain, new { @class = "e-textbox" })
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_id_cis__system_country">Země inzerátu</label>
                @Html.EJ().DropDownListFor(model => model.countries).Datasource(Model.countries).DropDownListFields(Df => Df.Text("s_name").Value("nl_id")).Value(Model.ticker.nl_id_cis__system_country.ToString()).Width("100%")
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="b_new_in_country">Nové v zemi</label><br />
                @Html.CheckBoxFor(model => model.ticker.b_new_in_country)
            </div>
        </div>
        <div class="col-md-5">
        </div>
        <div class="col-md-1">
            <label class="control-label">Ticker #@Model.ticker.nl_id</label>
            @Html.HiddenFor(model => model.ticker.nl_id)
        </div>
    </div>

    <div class="row">
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_id_cis__car_make">Značka</label>
                @Html.EJ().DropDownListFor(model => model.carMakes).Datasource(Model.carMakes).DropDownListFields(Df => Df.Text("s_name").Value("nl_id_parent").ID("nl_id_parent")).Value(Model.ticker.nl_id_cis__car_make.ToString()).Width("100%").CascadeTo("nl_id_cis__car_model")
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_id_cis__car_model">Model</label>
                @Html.EJ().DropDownListFor(model => model.carModels).Datasource(Model.carModels).DropDownListFields(Df => Df.Text("s_name").Value("nl_id")).Value(Model.ticker.nl_id_cis__car_model.ToString()).Width("100%")
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_product_year">Rok výroby</label>
                @Html.EJ().NumericTextBoxFor(model => model.ticker.nl_product_year).ShowSpinButton(false).Width("100%")
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="b_has_sb">SB</label><br />
                @Html.CheckBoxFor(model => model.ticker.b_has_sb)
            </div>
        </div>
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_id_cis__car_body_type">Karoserie</label>
                @Html.EJ().DropDownListFor(model => model.bodyTypes).Datasource(Model.bodyTypes).DropDownListFields(Df => Df.Text("s_name").Value("nl_id")).Value(Model.ticker.nl_id_cis__car_body_type.ToString()).Width("100%")
            </div>
        </div>
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_id_cis__ticking_km_range">Najeto KM</label>
                @Html.EJ().DropDownListFor(model => model.kmRanges).Datasource(Model.kmRanges).DropDownListFields(Df => Df.Text("s_name").Value("nl_id")).Value(Model.ticker.nl_id_cis__ticking_km_range.ToString()).Width("100%")
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_id_cis__ticking_fuel_type">Typ paliva</label>
                @Html.EJ().DropDownListFor(model => model.fuelTypes).Datasource(Model.fuelTypes).DropDownListFields(Df => Df.Text("s_name").Value("nl_id")).Value(Model.ticker.nl_id_cis__ticking_fuel_type.ToString()).Width("100%")
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="s_seller_name">Společnost</label>
                @Html.TextBoxFor(model => model.ticker.s_seller_name, new { @class = "e-textbox" })
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="s_spz">SPZ</label>
                @Html.TextBoxFor(model => model.ticker.s_spz, new { @class = "e-textbox" })
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="s_vin">VIN</label>
                @Html.TextBoxFor(model => model.ticker.s_vin, new { @class = "e-textbox" })
            </div>
        </div>
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_id_cis__ticking_condition">Exteriér - stav</label>
                @Html.EJ().DropDownListFor(model => Model.conditions).Datasource(Model.conditions).DropDownListFields(Df => Df.Text("s_name").Value("nl_id")).Value(Model.ticker.nl_id_cis__ticking_condition.ToString()).Width("100%")
            </div>
        </div>
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_id_cis__ticking_segment">Segment</label>
                @Html.EJ().DropDownListFor(model => model.segments).Datasource(Model.segments).DropDownListFields(Df => Df.Text("s_name").Value("nl_id")).Value(Model.ticker.nl_id_cis__ticking_segment.ToString()).Width("100%")
            </div>
        </div>
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="s_phone">Telefon</label>
                @Html.TextBoxFor(model => model.ticker.s_phone, new { @class = "e-textbox" })
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_id_cis__ticking_customer_type">Typ zákazníka</label>
                @Html.EJ().DropDownListFor(model => model.customerTypes).Datasource(Model.customerTypes).DropDownListFields(Df => Df.Text("s_name").Value("nl_id")).Value(Model.ticker.nl_id_cis__ticking_customer_type.ToString()).Width("100%")
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="s_seller_name">Společnost CRM</label>
                @Html.TextBoxFor(model => model.ticker.s_seller_name, new { @class = "e-textbox" })
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="s_name_city">Město</label>
                @Html.TextBoxFor(model => model.ticker.s_name_city, new { @class = "e-textbox" })
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="b_mobile_buying">MB</label><br />
                @Html.CheckBoxFor(model => model.ticker.b_mobile_buying)
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_customer_price">Cenaz zákazníka</label>
                @Html.EJ().NumericTextBoxFor(model => model.ticker.nl_customer_price).ShowSpinButton(false).Width("100%")
            </div>
        </div>
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_buying_price">Výkupní cena</label>
                @Html.EJ().NumericTextBoxFor(model => model.ticker.nl_buying_price).ShowSpinButton(false).Width("100%")
            </div>
        </div>
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_selling_price">Prodejní cena</label>
                @Html.EJ().NumericTextBoxFor(model => model.ticker.nl_selling_price).ShowSpinButton(false).Width("100%")
            </div>
        </div>
        <div class="col-md-2">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_level">Grade</label>
                @Html.EJ().NumericTextBoxFor(model => model.ticker.nl_level).ShowSpinButton(false).Width("100%")
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="nd_liquidity">Likvidita</label>
                @Html.EJ().NumericTextBoxFor(model => model.ticker.nd_liquidity).ShowSpinButton(false).Width("100%")
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_web_position">Web Pozice</label>
                @Html.EJ().NumericTextBoxFor(model => model.ticker.nl_web_position).ShowSpinButton(false).Width("100%")
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-5">
            <div class="form-group">
                <label class="control-label requiredField" for="s_note_ticker">Poznámka</label>
                @Html.TextBoxFor(model => model.ticker.s_note_ticker, new { @class = "e-textbox" })
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="b_ac">AC</label><br />
                @Html.CheckBoxFor(model => model.ticker.b_ac)
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="b_automat">Automat</label><br />
                @Html.CheckBoxFor(model => model.ticker.b_automat)
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="b_4x4">4x4</label><br />
                @Html.CheckBoxFor(model => model.ticker.b_4x4)
            </div>
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="b_6seats">5+ Seats</label><br />
                @Html.CheckBoxFor(model => model.ticker.b_6seats)
            </div>
        </div>
        <div class="col-md-1">
        </div>
        <div class="col-md-1">
            <div class="form-group">
                <label class="control-label requiredField" for="nl_web_position_de">Web pozice DE</label>
                @Html.EJ().PercentTextBoxFor(model => model.ticker.nl_web_position_de).ShowSpinButton(false).Width("100%")
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-9">
        </div>
        <div class="col-md-2">
            @Html.EJ().Button("btnDateSelect").Text("Save").Type(ButtonType.Submit).Size(ButtonSize.Medium)
        </div>
    </div>

}


Attachment: screenshots_11c025c7.zip

Tom Frajer
Replied On May 24, 2016 07:02 AM UTC

I was playing around little bit and discovered that I can get values from syncfusion componends this way:

        public ActionResult TickingEditSubmit(FormCollection form)
        {
            var wp = form["tickernl_web_position"];
            var wp2 = Request["tickernl_web_position"];
        }

I think that this is the root of the problem. When I have nested object in my model, Syncfusion components generate wrong name attribute for form fields. It should be like this: 

"ticker.nl_web_position"

Standard MVC components are working in different way and they are generating name attributest with dot as a separator between nested object and actual attribute in the nested object.

Tom Frajer
Replied On May 24, 2016 07:44 AM UTC

Can I explicitly define name atribute for DropDownListFor and NumericTextBoxFor in my view code?
If this is possible and I will set correct names, maybe values will be atomatically passed to the model.

But still it would be nice to have all this happen automatically without any special configuration so I will not have to write more code than necessary...

Tom Frajer
Replied On May 24, 2016 07:50 AM UTC

For example this:

@Html.EJ().DropDownListFor(m => m.carMakes).Datasource(Model.carMakes).DropDownListFields(Df => Df.Text("s_name").Value("nl_id_parent").ID("nl_id_parent")).Value(Model.ticker.nl_id_cis__car_make.ToString()).Width("100%").CascadeTo("nl_id_cis__car_model")

Generates this:

<span id="carMakes_container" class="e-in-wrap e-box"><input type="hidden" id="carMakes" class="e-dropdownlist e-js" tabindex="" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-haspopup="true" aria-owns="carMakes_popup" name="carMakes" value="70858" style="display: none;"><input id="carMakes_hidden" class="e-input" readonly="true" tabindex="-1" data-role="none"><span id="carMakes_dropdown" class="e-select" role="button" unselectable="on"><span class="e-icon e-down-arrow" aria-label="select" unselectable="on"></span></span></span>

But I would rather see this:

<span id="carMakes_container" class="e-in-wrap e-box"><input type="hidden" id="ticker.nl_id_cis__car_make" class="e-dropdownlist e-js" tabindex="" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-haspopup="true" aria-owns="carMakes_popup" name="ticker.nl_id_cis__car_make" value="70858" style="display: none;"><input id="carMakes_hidden" class="e-input" readonly="true" tabindex="-1" data-role="none"><span id="carMakes_dropdown" class="e-select" role="button" unselectable="on"><span class="e-icon e-down-arrow" aria-label="select" unselectable="on"></span></span></span>

Prince Oliver [Syncfusion]
Replied On May 24, 2016 01:48 PM UTC

Hi Tom, 

Thanks for contacting Syncfusion support. 

Issues: 

  1. Generated name attribute without dot separator in  NumericTextBoxFor when binding complex data source.
  2. Value is not maintained after the postback in DropDownListFor control.

The two above mentioned issues are already fixed internally and will be available in 2016 volume 2 main release. In case you need to have a workaround for second issue, you need to manually remove the value attribute of the dropdownlist input element and set the value to the dropdownlist using clientside create event. Here is a sample code 

 
<script> 
 
    function onCreate() { 
        var value = this.element.attr("value"); 
        if (this.element.attr("value") != null){ 
            this.element.removeAttr('value'); 
        } 
        this.model.value = ""; 
        this.setModel({ value: value }); 
    } 
</script> 


Our strongly typed controls work similar to default MVC strongly typed controls as we have designed them in similar way. Due to these issues you may feel that our strongly typed controls to be different, sorry for the inconvenience. After the fix it will work similar to Default MVC strongly typed controls. Let us know if you have any further issues. 

Regards, 
Prince 


Tom Frajer
Replied On May 31, 2016 07:01 AM UTC

Perfect, I will be lucky once Volume 2 main release will be released :)

Kasithangam C [Syncfusion]
Replied On June 1, 2016 06:26 AM UTC

Hi Tom, 
Thanks for your update.A support incident to track the status of the reported issues has been created under your account. Please log on to our support website to check for further updates. 
Please let us know if you have further query. 
 
Regards, 
Kasithangam 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;