I have one View and in which there 3 partial views are rendering.
And there is one Save button on the parent view(Index,in which the partial views are rendering).This Save button is common for all of the partial views.
My problem is, i am not getting the way in which i can check is there any model validation is firing on any of the partial views while click on Save button.
I used below check on Save button click :-
var status = $('form').valid();
But its not checking the validations of all the partial views.Its just checking the validations in that particular partial view in which i am clicking the Save button.
I got the solution for that.We can simply check the length of "input-validation-error" class on form's submit event.Just like that :-
if($(".input-validation-error").length == 0)
{
//there is no validation on form.
}else
{
//validation is firing somewhere.
}
Related
i'm trying to code form where you can navigate inside with a next button ( who will hide the current fieldset and show the next one ) and a previous one ( who will hide the current fieldset and show the previous one ). Those two input have a onclick function that will change the fieldset className to active from inactive depending on which fieldset we are. I want to change the next button input type when the user reach the final fieldset so he can submit, but it seems that it automatically trigger the submit event, which means when the user get to the final fieldset, he cant fill any input because the form will submit automatically.
So here's the code :
//When the last fieldset show
if (fieldset[4].className == "active") {
var next = document.getElementById('next');
next.onclick='';
next.type="submit";
next.value="Submit";
next.id='submit';
}
Is there something that i should add to stop the submit auto-firing ?
I've tested your code in JSFiddle and it works good. It means there is something that trigger submit. May be you can post whole javascript in that page and then I can check what is the issue.
var next = document.getElementById("next");
//next.type="submit";
next.setAttribute('type', 'submit'); // I prefer using .setAttribute method
next.onclick='';
next.value="Submit";
next.id='submit';
<form>
<input name="q" value="hello">
<input type="text" id="next">
</form>
I think instead of trying to "hack" the existing button and turn it into the submit, you could just have two buttons, one "next" and another one "submit-button" (hidden initially), once the user advances to the final step, you can hide the "next" button and show the "submit-button" button.
It can be something like this:
//When the last fieldset show
if (fieldset[4].className == "active") {
// hide the next button
document.getElementById('next').style.display='none';
// show the submit button
document.getElementById('submit-button').style.display='';
}
And it would be not complex to make these buttons to appear exactly on the same place with css, so the user will not notice the replacement.
There are browsers who do not allow you to change the type for security reasons. So you will often have problems with it. Just switch between two inputs as boris mentioned (or replace it completely). But to answer your question:
You can catch the autosubmit with another on submit event. First on click mark the button with a class or data attribute like "preventSubmit". Within the submit event check if this class or data attribute exists and prevent the submit (f.ex with prevent default()) and remove the class that all wanted submits by users clicks are not stopped.
Why not just add an event to submit the form you are currently on:
if (fieldset[4].className == "active") {
var next = document.getElementById('next');
next.onclick=(function() { document.forms[0].submit(); });
//next.type="submit";
next.value="Submit";
next.className="MySubmit"; // try to style it as a button for better UX
//next.id='submit';
}
i am having a page with grid view and some checkbox fields init.
i added a submit button to it by adding echo CHtml::submitButton('Submit-form');
But, that button is not responding.
why so?
how i should submit this form?
my view page
my controller page
In your controller you have:
public function actionmyaction()
{
echo \'myaction reaced\';
var_dump($_POST);
}
You have to use camelcase with that, so actionMyaction() would probably do the trick.
i have developed a simple calculator like in windows calculator,
but unlike in windows calculator, after clicking any button, the focus on that button is still there on the particular clicked button.
so how to never get focus for all buttons on calculator form ... ?
i don't think that it will better to write loose focus code on every button's click event ... so any better solution ?
Without seeing any code of yours, I am going to assume that you have a text box that displays the numbers pressed by the user, so you need to set the focus to the text box once a user clicks a button, like this:
TextBox1.Focus()
Note: If your text box is not named TextBox1, then change the name to whatever your text box is actually named.
Instead of a standard button use an instance of a NoFocusButton class derived from the Standard button. In this class override the ShowFocusCues property and return always false.
Form f = new Form();
// Need to add manually the buttons to your form unless you build a customcontrol
NoFocusButton b = new NoFocusButton();
b.Text = "ClickMe";
f.Controls.Add(b);
f.Show();
// Class derived by the Button control, it is identical but the
// property that control the drawing of the Focus rectangle returns FALSE
// tricking the WinForm system to avoid to draw the focus rectangle
class NoFocusButton : System.Windows.Forms.Button
{
protected override bool ShowFocusCues
{
get
{
return false;
}
}
}
The credit goes to Remove Focus Rectangle from Button
I have a page for listing items, and I have anchors in each of the items to edit it.
So when I click on the edit link, it will take me to the edit page, which have save button and cancel button.
I want it when I click the save button it'll take me to confirmation page which have OK and cancel button.
I know in asp.net mvc you can send model into the view by this
return View("Edit", model);
It is sensible to then write each of the model property like this in the view
#Html.EditorFor( model => model.name )
#Html.EditorFor( model => model.description )
//more properties here...
So that after I click the save button, I can have the model back in the controller
But after the edit page, I only need to view a question in the confirmation page do I have to write it manually like this
#Html.HiddenFor( model => model.name )
#Html.HiddenFor( model => model.description )
//more properties here...
Is there a one line hassle free function to do this in asp.net mvc?
You can use #Html.EditorForModel() helper. However this method will produce default UI elements like textboxes. You can provide a custom template that will produce hidden inputs.
I'm using .Net MVC 4.
I have two buttons on one View wrapped around two separate Html.BeginForm statements. The first one is visibile and the second one is not (it depends if the first button logic after the post is successfull).
How can I make visibile the second button after the first button pressed goes into the Controller method? The method basically says, I'm OK, now I can make visible the second button. I'm passing back a View. Is there a viewbag variable (or something of the sort) I can set that once I get back into the View, I can make that second button visisble?
The second button is just an input button with an Id value.
Is there a viewbag variable (or something of the sort) I can set that
once I get back into the View, I can make that second button visisble?
Yeah but since I am not a big fan of ViewBag I would suggest you adding a boolean property to your model and then set this property in the POST controller action.
[HttpPost]
public ActionResult SomeAction(MyViewModel model)
{
model.IsSecondButtonVisible = true;
return View(model);
}
and then inside the view:
#if (Model.IsSecondButtonVisible)
{
<input type="button" value="the second button" />
}
First Method: As explained above, but I am afraid, it will not work if for example you have a partial view and based on something there you want to show or hide something.
Second Method:Initial Page load, button is visible.
<input id='btnAdd' type='button' value='Add' style='display:block;'/>
Based on some action on page/partial view
<script>
function disableAdd() {
$('#btnAdd').hide();
}
</script>
*Please note, jquery will not be able to hide/show if you use visibility in style sheet.