i have the following view:-
<div id = "partialWrapper">
#using (Ajax.BeginForm("Create", "Answer", new AjaxOptions
{
HttpMethod = "Post",
InsertionMode = InsertionMode.InsertAfter,
UpdateTargetId = "incrementanswer",
OnSuccess = "removePartial"
}))
{
<div id = "returnedquestion">
#Html.ValidationSummary(true)
<fieldset>
<legend>Answer here</legend>
<div class="editor-label">
#Html.LabelFor(model => model.Description)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Description)
#Html.ValidationMessageFor(model => model.Description)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.IsRight)
</div>
<div class="editor-field">
#Html.DropDownList("IsRight", String.Empty)
#Html.ValidationMessageFor(model => model.IsRight)
</div>
</fieldset>
<input type= "hidden" name = "questionid" value = #ViewBag.questionid>
<input type= "hidden" name = "assessmentid" value = #ViewBag.assessmentid>
<input type="submit" value="Add answer" />
</div>
}
</div>
i want to clear all the data inside the fields so that the users can easily add new objects, i tried the following but these will remove the text and fields :-
function removePartial() {
$("#partialWrapper").remove();
}
and
function removePartial() {
$("#partialWrapper").empty();
}
so is there a way to clear the text inside the all the fields within a Div without removing the fields themself.
BR
Try reseting the form:
$('#partialWrapper form')[0].reset();
Related
MVC formcollection not showing all controls
[HttpPost]
public ActionResult Create(EmployeeJOBModel EmployeeJOB, FormCollection Formcoll, string Module_Name)
{
}
object Formcoll showing only two controls from below code:
CODE:
Employee Info
<div class="editor-label">
#Html.LabelFor(model => model.Employee_Name)
</div>
<div class="editor-field">
#Html.TextBoxFor(model => model.Employee_Name, new { #readonly = "readOnly" })
#Html.ValidationMessageFor(model => model.Employee_Name)
</div>
</fieldset>
<fieldset>
<legend>Employee Job Assignment</legend>
<div class="editor-label">
#Html.LabelFor(model => model.Client_Name)
</div>
<div class="editor-field">
#*#Html.EditorFor(model => model.Client_Name)*#
#Html.ValidationMessageFor(model => model.Client_Name)
#using (Html.BeginForm())
{
#Html.DropDownList("ClientName", ViewData["ClientName"] as List<SelectListItem>, new { #onchange = "Call_Client_Changefunc(this.value," + ViewData["Employee_ID"] + ")" })
}
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Component_Name)
</div>
<div class="editor-field">
#*#Html.EditorFor(model => model.Component_Name)*#
#Html.ValidationMessageFor(model => model.Component_Name)
#using (Html.BeginForm())
{
#Html.DropDownList("Component_Name", ViewData["Component_Name"] as List<SelectListItem>, new { #onchange = "Call_Component_Changefunc(this.value," + ViewData["Employee_ID"] + ")" })
}
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Module_Name)
</div>
<div class="editor-field">
#Html.ValidationMessageFor(model => model.Module_Name)
#using (Html.BeginForm())
{
#Html.DropDownList("Module_Name", ViewData["Module_Name"] as List<SelectListItem>)
}
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
from Above it shows only ClientName and Employee_ID
why can anybody help me?
I have a view A From ControllerA Which has two buttons 1. Create 2. Update
Upon clicking update or Create its opening a new partial viewB As popup from another controller B.
What iam trying to get is If a record is created successfully in b I am now closing the popup. Apart from closing the popup I want to display a message in view A.
I am trying like this:
Controller B
public ActionResult Create(FormCollection args)
{
var obj = new ProjectManagernew();
var res = new ProjectViewModelNew();
try
{
UpdateModel(res);
if (obj.AddUpdateOrderField(res))
{
ViewBag.RecordAdded = true;
ViewBag.Message = "Project Added Successfully";
}
return View(res);
}
catch (Exception)
{
//ModelState.AddRuleViolations(res.GetRuleViolations());
return View(res);
}
}
And in the view A:
#if(ViewBag.Message!=null)
{
#ViewBag.Message
}
View B:
#model DreamTrade.Web.BL.ViewModels.ProjectViewModelNew
#{
ViewBag.Title = "Create";
Layout = "~/Views/Shared/_Layout_Popup.cshtml";
}
#if (ViewBag.RecordAdded != null && (bool)ViewBag.RecordAdded)
{
<script type="text/javascript">
parent.$.nmTop().close();
$('#jqgprojectnew').text("Record added successfully");//jqgprojectnew is the name of grid in view A
</script>
}
<h2>Create</h2>
#using (Html.BeginForm()) {
#Html.ValidationSummary(true)
<fieldset>
<legend>Project</legend>
#Html.HiddenFor(model => model.ProjectID)
<div class="editor-label">
#Html.LabelFor(model => model.ProjectDetail)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.ProjectDetail)
#Html.ValidationMessageFor(model => model.ProjectDetail)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.ProjectRef)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.ProjectRef)
#Html.ValidationMessageFor(model => model.ProjectRef)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.ProjectName)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.ProjectName)
#Html.ValidationMessageFor(model => model.ProjectName)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.StatusList)
</div>
<div class="editor-field">
#Html.DropDownListFor(model => model.ProjectStatusId,new SelectList(Model.StatusList,"SourceStatusId","Description"),"Please Select")
#Html.ValidationMessageFor(model => model.ProjectStatusId)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.CustomerList)
</div>
<div class="editor-field">
#Html.DropDownListFor(model => model.Id,new SelectList(Model.CustomerList,"Id","Name"),"Please Select")
#Html.ValidationMessageFor(model => model.Id)
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
<div>
Back to list
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
}
please let me know where iam doing wrong
Include a label field where you want to show the message.
<label id=mylabel></label>// Add this before jqgrid
Modify the code to:
#if (ViewBag.RecordAdded != null && (bool)ViewBag.RecordAdded)
{
<script type="text/javascript">
parent.$.nmTop().close();
$('#mylabel').text("Record added successfully");
</script>
}
i have the following ajax.actionlink :-
<div id ="link">
#Ajax.ActionLink("Add New Answer", "Create", "Answer",
new { questionid = Model.QuestionID },
new AjaxOptions
{
HttpMethod = "Get",
UpdateTargetId = "link",
InsertionMode = InsertionMode.InsertAfter,
LoadingElementId = "progress"
})
</div>
where the above link will retrun the following _answer partial view which contains an Ajax.Actionlink:-
#using (Ajax.BeginForm("Create", "Answer", new AjaxOptions
{
HttpMethod = "Post",
InsertionMode = InsertionMode.InsertAfter,
UpdateTargetId = "incrementanswer",
}))
{
<div id = "returnedquestion">
#Html.ValidationSummary(true)
<fieldset>
<legend>Answer here</legend>
<div class="editor-label">
#Html.LabelFor(model => model.Description)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Description)
#Html.ValidationMessageFor(model => model.Description)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.IsRight)
</div>
<div class="editor-field">
#Html.DropDownList("IsRight", String.Empty)
#Html.ValidationMessageFor(model => model.IsRight)
</div>
</fieldset>
<input type= "hidden" name = "questionid" value = #ViewBag.questionid>
<input type= "hidden" name = "assessmentid" value = #ViewBag.assessmentid>
<input type="submit" value="Add answer" />
</div>
}
</div>
currently after clicking on the submit button the "UpdateTargetId = "incrementanswer", will be updated with the result of the submition, but the problem is that i also need to remove the current _answer partial view (currently the view containing the values i have inserted will still be displayed after clicking on the submit ajax.beginform)
load your partial view inside a wrapper div
<div id="partialWrapper">
#Html.partial("yourpartial")
</div>
declare an OnSuccess event handler
#using (Ajax.BeginForm("Create", "Answer", new AjaxOptions
{
HttpMethod = "Post",
InsertionMode = InsertionMode.InsertAfter,
UpdateTargetId = "incrementanswer",
OnSuccess="removePartial"
}))
define the removePartial
<script>
function removePartial(){
$("#partialWrapper").remove();
}
</script>
I create view by model Article.
class Article
{
public string Title {get;set;}
public List<string> Terms {get;set}
}
Terms - can be any count, and I want that they can be added gradually
#using (Html.BeginForm("Create"))
{
#Html.ValidationSummary(true)
<fieldset>
<legend>CreateArticle</legend>
<div class="editor-label">
#Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Title)
#Html.ValidationMessageFor(model => model.Title)
</div>
<div class="editor-label">
Terms:
</div>
<div id="divList">
</div>
#using (Ajax.BeginForm("Update", new AjaxOptions() { Confirm = "Add", HttpMethod = "Post", UpdateTargetId = "divList", InsertionMode = InsertionMode.InsertAfter }))
{
#Html.Partial("_TermPP", "")
<input id="count" name="count" type="hidden" value="-1" />
<input type="submit" value="add" onclick="javascript:plus()" />
}
</fieldset>
}
_TermPP:
#model String
<div>
<input type="text" name="terms[#(ViewBag.Count==null?0:ViewBag.Count)]" value="#(Model == null ? "" : Model)" /> </div>
when the click is sent to a form of ADD but I need to create on the Update. How do this?
You may take a look at the following blog post. Also please note that you cannot nest 2 <form> elements as you did in your code - this is invalid HTML and might result in undefined behavior.
I am creating a loginform like this:
#using (Ajax.BeginForm("Login", new AjaxOptions()
{
HttpMethod = "POST",
OnComplete = "onComplete"
}))
{
#Html.ValidationSummary(true)
<fieldset>
<div class="editor-label">
#Html.LabelFor(model => model.Username, "Username")
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Username)
#Html.ValidationMessageFor(model => model.Username)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Password, "Wachtwoord")
</div>
<div class="editor-field">
#Html.PasswordFor(model => model.Password)
#Html.ValidationMessageFor(model => model.Password)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Remember, "Remember me")
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Remember)
#Html.ValidationMessageFor(model => model.Remember)
</div>
<p>
<input type="submit" value="Inloggen" />
</p>
</fieldset>
}
Now the password is send unhashed over the internet for validation to the model, which is not safe. I want to make sure the password is always hashed going over the line and preventing man in the middle sniffers.
The onBegin won't work because the elements cannot be modified anymore after this, any other ideas?
You can do it without ajax by catching the submit event and hash the password before posting the form
#using (Html.BeginForm("LogOn","Login",FormMethod.Post,new {id = "loginForm"})) {
<div>
<fieldset>
<legend>Account information</legend>
<div class="editor-label">
#Html.LabelFor(m => m.UserName)
</div>
<div class="editor-field">
#Html.TextBoxFor(m => m.UserName)
#Html.ValidationMessageFor(m => m.UserName)
</div>
<div class="editor-label">
#Html.LabelFor(m => m.Password)
</div>
<div class="editor-field">
#Html.PasswordFor(m => m.Password, new {id = "password"})
#Html.ValidationMessageFor(m => m.Password)
</div>
<div class="editor-label">
#Html.CheckBoxFor(m => m.RememberMe)
#Html.LabelFor(m => m.RememberMe)
</div>
<p>
<input type="submit" value="Connect" id="submit"/>
</p>
</fieldset>
</div>}
For example with this javascript code :
$(function () {
$("#loginForm").on("submit",function (e) {
var form = $(this);
var pass = $("#password").val();
$("#password").val(MD5(token + MD5(pass)));
form.submit();
});
});