Assign editorfor value to radiobutton in mvc view - asp.net-mvc

I have a scenario where i have 3 radio buttons two of them have default values and for the third one I want that it should be assigned the value of a textbox. How can I achieve this below is some of my code :
<tr>
<td>
<label style="padding-bottom:0.5em;font-size:1em">
#Html.RadioButtonFor(model => model.LicenseValidityDuration, "0", new { style = "width:2em" })
Never
</label>
</td>
<td></td>
</tr>
<tr>
<td>
<label style="padding-bottom:0.5em;font-size:1em">
#Html.RadioButtonFor(model => model.LicenseValidityDuration, "-1", new { style = "width:2em" })
Always
</label>
</td>
<td></td>
</tr>
<tr>
<td>
<label style="padding-bottom:0.5em;font-size:1em">
#Html.RadioButtonFor(model => model.LicenseValidityDuration, model => model.LicenseValidityDuration, new { style = "width:2em" })
Days Before Expiry
</label>
</td>
<td>
#Html.EditorFor(model => model.LicenseValidityDuration)
</td>
</tr>

Related

How to calculate total value from razor view with javascript? MVC project

I got a .Net project using MVC and Razor.
I pass to the view a list containing products, where I have ProdutoValor( product value) with a TextboxFor for QuantidaVenda (Number os itens sold) for each iten. I want to get the value "QuantidadeVenda * ProdutoValor" for each item and show in a textbox the total value. How can I manage to do that with javascript?
I wanto to calculate the total as soon as the user enters the quantity
here is my view :
#for (int i = 0; i < Model.Produtos.Count; i++)
{
<tr>
<td>
#Html.HiddenFor(model => model.Produtos[i].ProdutoId)
#Html.HiddenFor(model => model.Produtos[i].ProdutoDescricao)
#Html.DisplayFor(model => model.Produtos[i].ProdutoNome)#Html.HiddenFor(model => model.Produtos[i].ProdutoNome)
</td>
<td>
#Html.DisplayFor(p => p.Produtos[i].ProdutoValor, new { #class = "form-control", Value = Model.Produtos[i].ProdutoValor }) #Html.HiddenFor(model => model.Produtos[i].ProdutoValor)
</td>
<td>
#Html.DisplayFor(p => p.Produtos[i].ProdutoEstoque, new { #class = "form-control", Value = Model.Produtos[i].ProdutoEstoque })#Html.HiddenFor(model => model.Produtos[i].ProdutoEstoque)
</td>
<td>
#if (Model.Produtos[i].ProdutoEstoque < 1)
{
#Html.TextBoxFor(p => p.Produtos[i].QuantidadeVenda, new { value = 0, disabled = "disabled" })
}
else
{
#Html.TextBoxFor(p => p.Produtos[i].QuantidadeVenda, new { value = 0, #id = "quantidade" })
if (Model.Produtos[i].ProdutoEstoque < Model.Produtos[i].QuantidadeVenda)
{<p>valor invalido</p>}
}
</td>
</tr>
}
[enter image description here][1]
how the list looks like
For Javascript:
Onchange Event for QuantidadeVenda(quantity):
function onchange()
{
var total= document.getElementById("name of total textbox").Value*
document.getElementById("name of quantity textbox").value
document.getElementById("name of total textbox").innerHTML=total
}
Jquery:
on change or LostFocus Event
$("input").change(function(){
var total= $("#name of total textbox").val()*
$("#name of quantity textbox").val()
$("#name of total textbox").val=total
});
Updated Code
HTML:
<table border="1">
<tr>
<td>product</td>
<td>quantity</td>
<td>total</td>
</tr>
<tr>
<td>
10
</td>
<td>
<input type="text" name="txt" value="" onchange="myFunction(this)">
</td>
<td><label>_</label></td>
</tr>
<tr>
<td>
10
</td>
<td>
<input type="text" name="txt" value="" onchange="myFunction(this)">
</td>
<td><label>_</label></td>
</tr>
</table>
Javascript:
function myFunction($this) {
debugger $($this).parent().siblings(":last").find('label').text($($this).parent().siblings().first().text().trim() * $this.value)
}

Why do textboxes not clear out after clearing out Model

I have a form which is submitted via ajax to the Controller. The Controller collects the data from the Model and then creates a new ViewModel and passes it to the partial view which is then updated on the Client.
The problem is that the textboxes are not cleared out as expected. The message arrives in the View as expected, so it doesn't make sense that the TextBoxes are not cleared out.
Yet it seems to be a browser issue as this is the resulting HTML, which note, does not have anything in the value:
<input id="Address_Address1" name="Address.Address1" type="text" value="" />
Yet the user sees the value that was priorly entered.
Here is the controller:
//Process Order Here
//This should clear out the ViewModel.
order = new OrderViewModel();
order.Message = "Report Added to your cart";
return PartialView("_NewOrderPartial", order);
This is the partial View:
#model NTC.PropertySearch.Models.OrderViewModel
#using (Ajax.BeginForm("NewOrder", "Order", new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "neworder" }))
{
<div id="neworder">
<table>
<tr>
<th style="width: 300px;">
<h3>Enter property address below</h3>
</th>
<th style="width: 30px;"></th>
<th style="width: 300px;">
<h3>Choose your report below</h3>
</th>
</tr>
<tr>
<td>
<div class="form">
<table>
<tr>
<td>
#Html.LabelFor(m => m.Address.Address1)
</td>
<td>
#Html.TextBoxFor(m => m.Address.Address1)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.Address1)
</td>
</tr>
<tr>
<td>
#Html.LabelFor(m => m.Address.Address2)
</td>
<td>
#Html.TextBoxFor(m => m.Address.Address2)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.Address2)
</td>
</tr>
<tr>
<td>
#Html.LabelFor(m => m.Address.City)
</td>
<td>
#Html.TextBoxFor(m => m.Address.City)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.City)
</td>
</tr>
<tr>
<td>
#Html.LabelFor(m => m.Address.State)
</td>
<td>
#Html.TextBoxFor(m => m.Address.State)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.State)
</td>
</tr>
<tr>
<td>
#Html.LabelFor(m => m.Address.ZipCode)
</td>
<td>
#Html.TextBoxFor(m => m.Address.ZipCode)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.ZipCode)
</td>
</tr>
</table>
<input type="submit" value="Add Report" />
#Html.DisplayFor(m=> m.Message)
</div>
</td>
</tr>
</table>
</div>
The reason for this is because the Html helpers such as TextBox are first looking at the ModelState when binding their values and only after that in the View model. This often happens when people attempt to modify/clear some value to the view model in an HttpPost controller action. The corresponding view will use the initial POSTed value and not the value in the view model.
You should clear the ModelState as well in your controller action:
ModelState.Clear();
order = new OrderViewModel();
Alternatively if you do not want to clear the entire ModelState (although in your case this seems to be the case as you are reinitializing the entire view model) you could clear only some properties that you intend to modify:
ModelState.Remove("SomeProperty");
viewModel.SomeProperty = "some new value";

Append an entire form using jquery in an absolute position

Just need to know how to append this entire html on a button click. I'm trying to create a list and display it over the page. .......................................................................................................................................
#Html.BeginForm(null, null, FormMethod.Get, new { name = "vouchers", id = "vouchers" })
<h2>Voucher</h2>
<div class="whole">
<div class ="top">
<label class ="lbl" >Assign a voucher Number </label>
<input type ="text" class="txt"/>
</div>
<div class="mid">
<div class ="tdes">
<table class="vtab">
<tr class="heading">
<td>
Date
</td>
<td>
Name
</td>
<td>
Category
</td>
<td>
Amount
</td>
<td>
To Account
</td>
</tr>
#foreach (var item in Model) {
<tr class="rows">
<td>
#item.Date.ToShortDateString()
</td>
<td>
#Html.DisplayFor(modelItem => item.Per)
</td>
<td>
#Html.DisplayFor(modelItem => item.CId)
</td>
<td>
#Html.DisplayFor(modelItem => item.Amt)
</td>
<td>
#Html.DisplayFor(modelItem => item.AId)
</td>
</tr>
}
</table>
</div>
</div>
<div class="bot">
<input type ="submit" value="Save" class ="btn" id ="save" />
<input type ="submit" value ="Print" class="btn" id ="print" />
</div>
</div>
}
How about using jQuery UI Dialog:
$("#vouchers").dialog({
autoShow: false,
// Other options
});
$("#somebutton").click(function() {
$("#vouchers").dialog("show");
});

getting MVC 2 form values in controller action using jquery ajax

I am working on asp.net MVC 2 application. I have a form like this:
<% using (Html.BeginForm("UpdateRecordingDetails", "Recording", FormMethod.Post, new { id = "frmRecordingEdit" }))
{%>
<%= Html.Hidden("AccountIDsEdit", ViewData["AccountIDsEdit"]) %>
<%= Html.Hidden("SelId", ViewData["SelId"]) %>
<%= Html.Hidden("EditMode", ViewData["EditMode"]) %>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr valign="top">
<td>
<table align="center">
<tr>
<td style="width: 32%;">
<%=Html.HiddenFor(model=>model.Id) %>
<b>Person Name</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.PersonName, new { #class = "textarea wide" , disabled ="disabled"})%>
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Email</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.Email, new { #class = "textarea wide" })%>
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Notes</b>
</td>
<td>
<%: Html.TextAreaFor(model => model.Notes, new { #class = "textarea widetextarea" })%>
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Display Notes on Playback</b>
</td>
<td>
<%: Html.DropDownList("isNotesVisible", ViewData["displayNotes"] as SelectList, new {#class = "normal" })%>
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Call ID Number</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.CallIDNumber, new { #class = "textarea normal", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Dblink Unique URL</b>
</td>
<td>
<span id="DBLinkUniqueURL" class="small">
<%= Model.DBLinkUniqueURL %>
</span>
<input id="btnCopy" type="button" value="Copy to Clipboard" onclick="copyToClipboard('DBLinkUniqueURL')" />
</td>
</tr>
<tr>
<td>
<b>Call Password</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.CallPassword, new { #class = "textarea wide", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td>
<b>Number Called</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.NumberCalledFrom, new { #class = "textarea wide", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td>
<b>Called From</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.NumberCalledTo, new { #class = "textarea wide", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td>
<b>Call Duration</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.CallDuration, new { #class = "textarea normal", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td>
<b>Call Rate</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.CallRate, new { #class = "textarea normal", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td>
<b>Call Cost</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.CallCost, new { #class = "textarea tiny", disabled = "disabled" })%>
<%: Html.TextBoxFor(model => model.CallCost, new { #class = "textarea normal", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td>
<b>User ID/ Email</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.LoginId, new { #class = "textarea wide", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td>
<b>Date/Time Added</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.CreationDate, new { #class = "textarea wide", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td>
<b>Call Status</b>
</td>
<td>
<%: Html.TextBoxFor(model => model.CallStatus, new { #class = "textarea normal", disabled = "disabled" })%>
</td>
</tr>
<tr>
<td>
<b>Archived</b>
</td>
<td>
<%: Html.CheckBoxFor(model => model.isArchived, new { disabled = "disabled"})%>
</td>
</tr>
</table>
</td>
</tr>
</table>
<%
}
%>
I have a button outside this form, which posts the form with jquery ajax like this:
function editAccountDetails() {
jQuery.ajax({
url: "/recording/UpdateRecordingDetails",
type: 'POST',
data: $('frmRecordingEdit').serialize(),
dataType: "json",
contentType: "application/json",
success: function (data) {
alert(data);
}
});
}
In controller action method, I am not getting all these fields. I get only the ones which are in viewdata or which are not disabled and checkbox value. My action method is:
[Authorize]
public ActionResult UpdateRecordingDetails(FormCollection form, CallRecordingModel objCampaignMode)
{
return Content("testing");
}
neither formcollection note the model has all the fields values which are in the form.
[Edit]
form has values for
AccountIDsEdit
SelId
EditMode
Id
Email
Notes
isNotesVisible
isArchived
model has values in three fields
email, Id, notes
<td>
<table align="center">
<tbody><tr>
<td style="width: 32%;">
<input type="hidden" value="2" name="Id" id="Id">
<b>Person Name</b>
</td>
<td>
<input type="text" value="Asif" readonly="readonly" name="PersonName" id="PersonName" disabled="disabled" class="textarea wide">
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Email</b>
</td>
<td>
<input type="text" value="asif#cc.com" name="Email" id="Email" class="textarea wide">
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Notes</b>
</td>
<td>
<textarea rows="2" name="Notes" id="Notes" cols="20" class="textarea widetextarea">asif notes</textarea>
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Display Notes on Playback</b>
</td>
<td>
<select name="isNotesVisible" id="isNotesVisible" class="normal"><option selected="selected">Yes</option>
<option>No</option>
</select>
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Call ID Number</b>
</td>
<td>
<input type="text" value="callIDNum002" name="CallIDNumber" id="CallIDNumber" disabled="disabled" class="textarea normal">
</td>
</tr>
<tr>
<td style="width: 32%;">
<b>Dblink Unique URL</b>
</td>
<td>
<span class="small" id="DBLinkUniqueURL">
http://temp.com/callIDNum002
</span>
<input type="button" onclick="copyToClipboard('DBLinkUniqueURL')" value="Copy to Clipboard" id="btnCopy">
</td>
</tr>
<tr>
<td>
<b>Call Password</b>
</td>
<td>
<input type="text" value="temppass" name="CallPassword" id="CallPassword" disabled="disabled" class="textarea wide">
</td>
</tr>
<tr>
<td>
<b>Number Called</b>
</td>
<td>
<input type="text" value="03344037289" name="NumberCalledFrom" id="NumberCalledFrom" disabled="disabled" class="textarea wide">
</td>
</tr>
<tr>
<td>
<b>Called From</b>
</td>
<td>
<input type="text" value="0442510406" name="NumberCalledTo" id="NumberCalledTo" disabled="disabled" class="textarea wide">
</td>
</tr>
<tr>
<td>
<b>Call Duration</b>
</td>
<td>
<input type="text" value="00:01:30" name="CallDuration" id="CallDuration" disabled="disabled" class="textarea normal">
</td>
</tr>
<tr>
<td>
<b>Call Rate</b>
</td>
<td>
<input type="text" value="4" name="CallRate" id="CallRate" disabled="disabled" class="textarea normal">
</td>
</tr>
<tr>
<td>
<b>Call Cost</b>
</td>
<td>
<input type="text" value="3" name="CallCost" id="CallCost" disabled="disabled" class="textarea tiny">
<input type="text" value="3" name="CallCost" id="CallCost" disabled="disabled" class="textarea normal">
</td>
</tr>
<tr>
<td>
<b>User ID/ Email</b>
</td>
<td>
<input type="text" value="asif_hameed_371#hotmail.com" name="LoginId" id="LoginId" disabled="disabled" class="textarea wide">
</td>
</tr>
<tr>
<td>
<b>Date/Time Added</b>
</td>
<td>
<input type="text" value="12/19/2012 12:00:00 AM" name="CreationDate" id="CreationDate" disabled="disabled" class="textarea wide">
</td>
</tr>
<tr>
<td>
<b>Call Status</b>
</td>
<td>
<input type="text" value="Completed" name="CallStatus" id="CallStatus" disabled="disabled" class="textarea normal">
</td>
</tr>
<tr>
<td>
<b>Archived</b>
</td>
<td>
<input type="checkbox" value="true" name="isArchived" id="isArchived" disabled="disabled"><input type="hidden" value="false" name="isArchived">
</td>
</tr>
</tbody></table>
</td>
[Edit2]
Request URL:http://localhost:62843/recording/UpdateRecordingDetails
Request Method:POST
Status Code:200 OK
Request Headersview source
Accept:application/json, text/javascript, */*; q=0.01
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Content-Length:0
Content-Type:application/json
Cookie:SiteBrowsedCookie=1;edited value&FirstVisit=9/14/2012 5:42:08 PM; Nop.customer=61f1bf57-034a-4427-a08c-e9442061f224; glimpseState=null; glimpseClientName=null; glimpseOptions=null; ASP.NET_SessionId=lephqzclxx35mjqier5to5l4; .CRM=85A97958C0415B3C8106A7EE2B473EE00C1F53C5E428C399AC951D7AFEA5A325C8BC54225AC959917CF1754734CF8DC6BD13DAAA7DA1EE64D4A177BB3FA3529992A1E596AF6D1D4391242C412EB809F8125EC03DBC1C5A36FDAE3BAB915E2233C30E0876EFE62B3D8CAE1CCAD020DA6791EA17FD3B085C1A913C8DBF822408FD0E2AA3B19F67AFE34C9176A3783F0935D61B847D51958ABB72AB2E9491864F956A90729E; returnUrl=returnUrl=http://localhost:62843/Account/Login
Host:localhost:62843
Origin:http://localhost:62843
Referer:http://localhost:62843/Recording/Detail
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.97 Safari/537.11
X-Requested-With:XMLHttpRequest
Response Headersview source
Cache-Control:private, s-maxage=0
Connection:Close
Content-Length:8
Content-Type:text/html; charset=utf-8
Date:Fri, 21 Dec 2012 07:16:02 GMT
Server:ASP.NET Development Server/10.0.0.0
X-AspNet-Version:4.0.30319
X-AspNetMvc-Version:3.0
Please suggest solution to it.
data: $('frmRecordingEdit').serialize(),
should be:
data: $('#frmRecordingEdit').serialize(),
because that's how id selectors work in jQuery.
Also you haven't shown how/where you are calling the editAccountDetails function that is sending the AJAX request but if this is inside an onsubmit handler of the form or an onclick handler of a submit button of this form or an onclick handler of some anchor you should make sure that you return false from this handler to ensure that you are cancelling the default action and giving chance of the AJAX call to execute. If you do not cancel the default action the browser will simply redirect away from the page leaving no chance of any AJAX calls to execute.

Why the value is changed after clicking the submit button?

I make one action method for 2 activities (new input and edit), and there is also only one
view to handle those activities.
But I don't understand no matter what activity happen, the action method always think it is a new input.
I learned that it because of the ID is always 0, but the problem is, when doing the edit, when in the view the ID is correct as the ID of the data, but when I click the submit button, the action method just see the 0 value of ID.
Here is the action method I used:
[HttpPost]
public ActionResult AddAssignment(SateliteSchedule SatSched)
{
var txt = "";
if (ModelState.IsValid)
{
if (SatSched.ID == 0)
{
db.SateliteSchedules.Add(SatSched);
txt = "{0} has been added!";
}
else
{
db.Entry(SatSched).State = EntityState.Modified;
txt = "{0} has been modified!";
}
db.SaveChanges();
Utility utl = new Utility();
TempData["message"] = string.Format(txt, utl.GetSateliteName(SatSched.SateliteID));
return RedirectToAction("FormAssignment");
}
else
{
ViewBag.Message = "ModelState is not Valid!";
return View("ErrorView");
}
}
And here is the view:
#using (Html.BeginForm("AddAssignment", "admin", FormMethod.Post))
{
#Html.ValidationSummary(true)
<table>
<tr>
<td>#Html.LabelFor(m => m.Tanggal)
</td>
<td>
#Html.EditorFor(m => m.Tanggal)
#Html.ValidationMessageFor(m => m.Tanggal)
</td>
</tr>
<tr>
<td>#Html.LabelFor(m => m.SateliteID)</td>
<td>
#Html.DropDownList("SateliteID", (IEnumerable<SelectListItem>)ViewBag.SatList, "--- Satelite ---")
#Html.ValidationMessageFor(m => m.SateliteID)
</td>
</tr>
<tr>
<td>#Html.LabelFor(m => m.WMOnDuty)</td>
<td>
#Html.DropDownList("WMOnDuty", (IEnumerable<SelectListItem>)ViewBag.WMList, "--- Worship Manager ---")
#Html.ValidationMessageFor(m => m.WMOnDuty)
</td>
</tr>
<tr>
<td>#Html.LabelFor(m => m.SMOnDuty)</td>
<td>#Html.EditorFor(m => m.SMOnDuty)</td>
</tr>
<tr>
<td>#Html.LabelFor(m => m.WLOnDuty)</td>
<td>#Html.EditorFor(m => m.WLOnDuty)</td>
</tr>
<tr>
<td>#Html.LabelFor(m => m.MLOnDuty)</td>
<td>#Html.EditorFor(m => m.MLOnDuty)</td>
</tr>
<tr>
<td>#Html.LabelFor(m => m.SoundMan)</td>
<td>#Html.EditorFor(m => m.SoundMan)</td>
</tr>
<tr>
<td valign=top>#Html.LabelFor(m => m.Note)</td>
<td>#Html.TextAreaFor(model => model.Note, new { #class = "memo-text" })</td>
</tr>
</table>
<div>
<input type="submit" value="Save" />
#Html.ActionLink("Kembali", "FormAssignment")
</div>
}
What should I check to fix this?
You have to have the Id as a hidden, so when you go in the method the model will have the id asigned to it (does it make sense?). try placing this in your form
#Html.HiddenFor(m => m.ID)

Resources