We Keep Coding

Razor: How to dynamically assign a value to a read only TextBox field?

I have a read-only text box which is supposed to be initialized to a value dynamically. This field is present on a page which is used to enter values to details corresponding to the player that was created in the previous page (I am using RedirectToAction() for this purpose, but was unable to access the passed "PlayerID" value from the controller of the current page. So decided on using TempData. ). Since the PlayerID changes each time a new player is added, this field should display that value while still remaining read-only.
Also, this is a 'required' field, so the form cannot be submitted until the value is set.
#Html.TextBoxFor(model => model.PlayerID, htmlAttributes: new { #readonly = "read-only", #class = "control-label col-md-2", value = #Html.Raw(TempData["PlayerID"]) })
How can I set the value of this field as it is in the TempData["PlayerID"]?

You can either have a JavaScript that runs on the page load, ex:
#section Scripts
{
<script>
$(function(){
$("#PlayerID").val('#TempData["PlayerID"]');
});
</script>
}
Or, you can initialize the Model for the view inside the action, so if your action name was 'PlayerDetails', then you should have something like this:
public ActionResult PlayerDetails()
{
return View(new Player{PlayerID=TempData["PlayerID"]}
}
This way, when the view get bound to the view model, it will be initialized to the passed value.

You can try below code:
#Html.TextBox("PlayerID", #TempData["PlayerID"] ,new { #readonly = "read-only", #class = "control-label col-md-2"})
Or in your case:
#Html.TextBoxFor(model => model.PlayerId, htmlAttributes: new { #readonly = "read-only", #class = "control-label col-md-2", Value = #Html.Raw(TempData["PlayerID"]) })

How to give javascript unique ID in htmleditfor method in .net MVC?

I want to give a unique id to htmleditfor method. I want to add Jquery datepicker in it. Please guide...
#Html.EditorFor(model => model.AdExpiryDate, new { htmlAttributes = new { #class = "form-control", placeholder = "MM/DD/YYYY" } })

Your generated html will look like this
<input type="text" id="AdExpiryDate" value="AdExpiryDate" />
You just need to add following javascript code at bottom of your view
<script>
$('#AdExpiryDate').datepicker();
</script>

As others have said, MVC will automatically add the property name from your model to the id and name attributes on the HTML element. However if you want to specify your own id for the element, just update your htmlAttributes:
#Html.EditorFor(model => model.AdExpiryDate, new { htmlAttributes = new { #class = "form-control", placeholder = "MM/DD/YYYY", id = "ad-expiry-date" } })
Then just update your javascript to target the new id that you added:
<script>
var expireDate = $('#ad-expiry-date').val();
alert(expireDate);
</script>

Lost remaining record after validation error comes in MVC

I have one MVC project,containing user registration form which have 25-30 fields to fill. After filling form if user forgot to fill mandatory field then it will shows validation error. But remaining all fields loss their data.
I mentioned in controller like
if (!ModelState.IsValid)
{
ModelToDBclass obj = new ModelToDBclass();
objModel.Id = Convert.ToInt32(obj.GetMaxPaperId());
objModel.countryNameDB = obj.GetcountryName();
return View(objModel);
}
and finally it returns the blank view. but at runtime when it comes to
return View(objModel); , the model shows the data with every field, but when it comes to view it unable to show record in text boxes and dropdown. I used textbox like,
<div class="col-sm-2"><input type="text" class="form-control" name="ConsumerFName" id="txtConsumerFirstName" placeholder="First Name" />
#Html.ValidationMessageFor(m => m.ConsumerFName)</div>
so, please help me how can i display filled record after validation error

You should always use Html Helper
#Html.EditorFor(model => model.FirstName, new { htmlAttributes = new { #class = "form-control" }, placeholder = "First Name", autofocus = "autofocus" })
Then only when the Model state is not valid, it will show the returned object values at the respective fields. Don't normal html tags.
Hope this helps

ASP.NET mvc4 - form elements inside ICollection loop

I want to make an editing function where you can add metafields (= specific fields for a category) to a category.
What I want to do in the view is
foreach (App.Models.Metafield field in Model.Category.Metafields)
{
<div class="field">
#Html.TextBoxFor(model => field.Name, new { #class = "form-control title" })
#Html.DropDownListFor(model => field.Type, Model.MetaTypes, new { #class = "form-control type" })
</div>
}
The problem is that the Metafields are not added to the viewModel when I hit the save button. So I guess the field.Name and field.Type should be replaced by something else..

This can't work this way because the sent form can't contain these dynamically generated fields with the same name.
However, you can collect the data from these dynamic fields using js and serialize it into a hidden field just before submitting the form, then you can parse it in your server side.
Here is an example with jquery:
$('#save-btn').click(function(e) {
$hidden = $("#hidden");
$hidden.val(getDynamicData());
});
function getDyanmicData() {
var data;
$fields = $(".field");
// get children and calculate data
return data;
}
This may be a bit too 'manual work', but I find it useful to know what's happening. For other solutions you can search form dynamic forms in ASP.NET MVC.

Please try this code
#for(int i=0;i<=Model.Category.Metafields.count();i++)
{
<div class="field">
#Html.TextBoxFor(m=> m[i].Name, new { #class = "form-control title" })
#Html.DropDownListFor(m=> m[i].Type, Model.MetaTypes, new { #class = "form-control type" })
</div>
}

Display error messages using c# mvc with razor view engine

I want to display error messages dynamically i.e, when the cursor moves out of the field but not when the form is submitted.
My requirement is like this:-
I have to design a registration form with some fields like name,address,phone number,email,password etc.
i designed it & saved the data successfully in DB but what i exactly required in the sense i have to display error messages dynamically without using "ajax" as i have already stated ...
My code is like this:-
View:-
<div class="venfor_line5" popText><label>#Resources.Resources.VendorReg_phoneNumber<img src="~/images/star.png" /> </label>
#Html.TextBoxFor(model => Model.MobileNumber, new { #class = "input" })
#Html.ValidationMessageFor(model => model.MobileNumber)</div>
<div class="venfor_line1" popText = #Resources.Resources.VendorReg_emailHintStr>
<label>#Resources.Resources.VendorReg_email<img src="~/images/star.png" /> </label>
#Html.TextBoxFor(model => Model.Email, new { #class = "input" })
#Html.ValidationMessageFor(model => model.Email)</div>
I have gone through many references but not found exactly what i am looking for.Any help would be greatly appreciated. can anyone guide me in resolving this issue.

You could use jQuery's focusOut() method to perform validation. Something like:
$('#elementId').focusOut(function(){
//do validation here
});

If you are using unobtrusive jQuery validation you could eagerly enable it so that it is automatically triggered onblur without requiring the user to submit the form:
$(document).ready(function () {
var settngs = $.data($('form')[0], 'validator').settings;
settngs.onfocusout = function (element) { $(element).valid(); };
});