OK, I have a form where the data is persisted into database with create/edit.
On edit page there is a checkbox with name audit_check which is clicked by a user and the logs should be generated.
if($form->isSubmitted()){
if(user checks){
//create logs
}else{
//do nothing
}
$em->persist($data);
$em->flush();
}
Since the requirement of the task is to generate click logs and checkbox is rarely clicked while the pages is often edited. How to get the user click behavior such that when the user checks/uncheck the logs must be generated that the user clicked the checkbox.
You could keep track of clicks made on such checkbox and submit that value together with the form data when it gets submitted. One way to achieve that would be having an hidden input like this:
<input type="hidden" id="clicksMade" name="" value="0" />
inside such form so that you'll have its value in the update action in the controller when the form gets submitted.
To update your click counter client side before the user submits the form (I used jQuery here I hope you don't mind):
$(document).ready( () => {
$('#audit_check').on('change', () => {
let i = parseInt( $('#clicksMade').val() );
$('#clicksMade').val(++i);
});
});
Related
I have a web page with several forms. Only one is visible at a time, depending on state.
On one form, pressing the enter key appears to be causing a reload of the page rather than triggering a click event for the form's button.
I have a lot of javascript, primarily because I need client side interaction with mailchimp. Because of that, I have disabled the form's action= html and have instead created a javascript function to handle the click. It works fine if you click on the button.
I have also assigned a listener for the sole field in the form:
var input = document.getElementById ("new-email-address");
input.addEventListener ("keyup", function(event)
{
if (event.keyCode === 13)
{
event.preventDefault();
document.getElementById("new-email-address").click();
}
});
Yet, when I click the enter key, the $(document).ready (function() executes. It's possible something else is executing beforehand, but, if so, I haven't found a way to discover that.
What could be causing this behavior ?
It turns out that the enter key is being handled at the form level. To disable that, I added this code for each form:
$("#the-form").keypress(function(e)
{
if (e.which == 13) // Enter key
return false;
});
i have a field ProductID and another field ProductName.I would like a validation where if product ID is entered and product type is not selected it should alert user to select product Name (combo box) on the submit button click.
What will be the appropriate way to do it? I do not wish to write any script hence cannot use custom validator.
how else can i write it?
i am using ASP.NET C#.
Thanks
You can use jQuery to do this very easily. Just wire a click event handler on your submit button. Take a look at this fiddle -
http://jsfiddle.net/8efopLff/1/
JQuery code
$("#btn").click(function(){
if($("#field1").val() != "" && $("#field2").val() == "")
{
alert("Please select field 2");
}
return false;
});
Here's the page I'm working on:
http://mcstevenswholesale.com/catalog.aspx
The textbox below the catalog allows you to skip to a specific page in the catalog. However, if you hit enter in that textbox rather than clicking the "Go" button, it submits the search function in the upper left column. I thought this would be because the entire page is located within an ASP form, but I don't have the same problem with the email signup box on the right side.
I have tried putting the page number textbox into its own HTML form, and have tried changing the button to an image, a button, and a submit input. None of these have worked. I don't want the page to reload, just the page to flip. I'm fairly new to ASP, so I'm sorry if I'm making a very obvious mistake.
Here's the code for the page number textbox (goToPage is a JS function that flips the catalog page):
<div id="goToPage">
Go to Page:
<input id="pageTextbox" type="text" onkeydown="if (event.keyCode == 13) goToPage();"></input>
<a onclick="goToPage()" href="#"></a>
</div>
The onkeydown makes the page change work, but it still fires the search function. How do I prevent it from doing that?
The default behavior of the enter key is to submit the current form in most (if not all) browsers.
You need to suppress the enter key's default behavior. The proper way to suppress the default behavior is to have the event handler return false.
If goToPage() returns false the simplest solution is the following:
onkeydown="if (event.keyCode == 13) return goToPage();"
If not you can add return false after the call to goToPage();
onkeydown="if (event.keyCode == 13) { goToPage(); return false} "
That will cause the enter key to not submit the form when pressed within the page number text box. If you want to disable it for the entire page see the following:
http://webcheatsheet.com/javascript/disable_enter_key.php
https://stackoverflow.com/questions/6017350/i-need-javascript-function-to-disable-enter-key
Try this:
onkeydown="if (event.keyCode == 13) { goToPage(); return false; }"
I have a basic CRUD application in ASP.Net MVC 4. The Create view of the CRUD format has a form with "save" and "cancel" buttons. When I click on save button, the data are stored correctly in the database and the view refresh to the previous list records.
I want to make a "save and add" button where the user click on it and then the data will stored and load again the "create" view.
Sorry my bad english...
Thanks.
To mfanto's point, if you wanted to be able to detect, as I believe you do, which button was clicked, just create both buttons with type="submit" and both with the same name. However, give them both different values. Like:
<input type="submit" name="whichButton" value="Save" />
<input type="submit" name="whichButton" value="SaveAndAdd" />
Then in your controller, you'll receive the button value in a parameter named the same as the button:
public ActionResult ActionName(Model model,string whichButton){
switch(whichButton) {
case "Save" : //do stuff and redirect to the list of records
break;
case "SaveAndAdd" : //do stuff and redirect to create
break;
}
}
You need to change the redirection in your Create action. This is called the Post/Redirect/Get pattern. When you POST your form data, your action will save it to the database, and then redirect somewhere else. Right now it's redirecting you to your list of items action (maybe RedirectToAction("Index")). Change it to redirect back to Create.
public ActionResult Create(DataModel data)
{
if (ModelState.IsValid)
{
// save data here
return RedirectToAction("Create");
}
}
I took the JQuery UI dialog form sample from JQuery UI website.
Since I wanted that, once the dialog is opened and the form is displayed, that pressing the key submits the form, I added the following in the onReady() :
$.extend($.ui.dialog.prototype.options, {
open: function() {
var $this = $(this);
// focus first button and bind enter to it
$this.parent().find('.ui-dialog-buttonpane button:first').focus();
$this.keypress(function(e) {
if( e.keyCode == 13 ) {
$this.parent().find('.ui-dialog-buttonpane button:first').click();
return false;
}
});
}
});
This does perfectly the trick (I mean the click() is triggered when it has to), but the following occurs :
When the form is first submited through a press on the key, the submission is performed once.
If I reopen the dialog, and submit it again with a press on the key, the form is submitted twice.
If I reopen the dialog, and submit it again with a press on the key, the form is submitted three times, and so on...
This can be tested with the following fiddle :
http://jsfiddle.net/fWW2E/
Let me add that doing so by clicking on the dedicated "Submit" button works properly, this fails only when pressing the key is involved.
Any ideas ?
Thank you !
Because since you're assigning this on "open" and your buttons are "closing" the dialog.
When this gets called though:
$('something').dialog('close');
doesn't actually remove the element, it just hides it. So the next time you click to open up a "new" dialog, you're really just showing the first one again. However the "open" event is getting fired again every time it's opened, which is adding a new keypress handler onto it.
Here's the fiddle. I actually write out to the console an array of the current handlers on that element. You'll see everytime you open the dialog that there is another keypress handler.
DEMO