Auto submit form in yii2 when onkeyup a filed - yii2

I using yii star rating for restaurant system, i have 'rating' table with field 'value' for save rate from user. When user click the star, form will submit without click button Send?

You can try to trigger the click on submit button, or fire submit event on the form when the user clicked on the star.
$(document).on('click', 'yourStarItemSelector', function() {
$('yourFormSelector').submit();
// or $('submitttButtonSelector').trigger('click');
})
If u use activeForm:
$(document).on('change.yii',"inputWithStarSelector", function(){
$('yourFormSelector').submit();
// or $('submitttButtonSelector').trigger('click');
});

Related

Accessing data-id within modal

I'm currently creating an edit payment method use-case for a website. This is the scenario.
1. There is an edit button for each payment method.
2. When the user clicks on the edit button for a method, a modal will appear for the user to enter in and submit changes for a payment method.
3. The modal will receive the payment method id in order to differentiate which payment method I have to edit.
Currently, I am basing it off of this code.
http://jsfiddle.net/4XJ54/279/
<input type="text" name="bookId" id="bookId" value="" />
As you can see when the user clicks on the button, it reveals the value of data-id. What I need to do is to perform href={data-id}.htm but I don't know how to refer to that value in this way because it is used with the input form instead.
Thanks for your help.
How about this:
$("button.btn-primary").on("click", function (e) {
e.preventDefault();
var _self = $(this);
var myBookId = $(".open-AddBookDialog").attr('data-id',$("#bookId").val());
var $modal=$(".open-AddBookDialog").attr('href');
$(".open-AddBookDialog").attr('href',$("#bookId").val()+".htm");
$($modal).modal('hide');
});
DEMO

Cannot unbind a click event?

I am trying to undo an event handler/listener that is added in an linked JS file in the header of the webpage.
The basic setup:
<form id="form_enter_giveaway" action="" method="post">
<input type="hidden" name="form_key" value="04b931caff99a0a688241e6da5f09839">
<input type="hidden" name="enter_giveaway" value="1">
Enter to Win! (1P)
</form>
JS file (http://www.steamgifts.com/js/header_functions.js):
$('.submit_entry, .remove_entry').click(function(){
$('#form_enter_giveaway').submit();
return false;
});
There is nothing native that should run if I click that link, and searching every reference to that link and that form in general seems to show that that single piece of JS is the only thing that could possibly be causing the form to submit.
But I have tried $('.submit_entry, .remove_entry') .unbind(), .off(), die() with the console; All with and without 'click', and every time I click that link tag it still submits. And it is interfering with the event I want to have run in its place.
Try this
var $selector = $('.submit_entry, .remove_entry');
// Binding the event using on so that it can be unbinded later
// that triggers the submitForm handler
$selector.on('click', submitForm);
function submitForm() {
$('#form_enter_giveaway').submit();
return false
}
// Unbind the event using off
$selector.off('click');
// Bind the event and prevent the default action of anchor
$selector.on('click', function(e) {
e.preventDefault();
});
Check Fiddle

How to call a function on click in x-editable form (Twitter Bootstrap)

I have a input text field inside a div(x-editable form). I need to call a Jquery function on the button click. How to do so.?
This is my div
<div class="input-append"><input type="text" id="WorkloadName" placeholder="enter your workload name" name=""></div>
This is my jquery function for x-editable form
jQuery.noConflict();
(function($) {
$(function() {
jQuery.fn.editable.defaults.mode = 'inline';
jQuery('#WLElementName').editable();
});
})(jQuery);
In x-editable form after clicking the textfield a form will appear, i need to call the function on the click of the submit button (blue button with tick mark, I could not post the image here since I don't have enough reputation score)
I tried calling the function using the class name of the button but its not coming. please help me to fix this
In your .editable declaration, add a dictionary parameter
url: function(params) {}
and perform your task in there.
See http://vitalets.github.com/x-editable/docs.html#editable for further documentation.

Zimra - How I can handle HTML forms in zimlets?

I try to create a tab Zimlet that contains a HTML form. I just want to now how I can handle submit button in my form or how can I submit a form with ajax toolkit.
Let me have a general suggestion...
Try to do everything base on zimbra standards
You can check and download examples to be familiar with the default way to do the different jobs...
Back to your question, how is your form made? is it a normal html form or created dynamically by javascript?
If html, just set the onclick of your submit form to the zimlet's function and define whatever you wanna do inside that function
<input onClick="yourzimlet.prototype.OkFunction();" type="button" >
yourzimlet.prototype.OkFunction= function(){
//do somthing...
}
if in javascript, you have (at-least) two ways
1-using normal onclick
var formTag = document.createElement("form");
//add form elements to formTag...
var inputTag = document.createElement("input");
inputTag.type= 'button';
inputTag.setAttribute("value", "submit ... ");
inputTag.onclick = function() { yourzimlet.prototype.OkFunction();}
formTag.appendChild(inputTag);
yourzimlet.prototype.OkFunction= function(){
//do somthing...
}
2-using zimbra javascript API
Instead of having a form with normal onclick, better (depends on your situation) to create a form dynamically using javascript and add a dwtButton as submit button
http://files.zimbra.com/docs/zimlet/zcs/7.2.0/jsdocs/symbols/DwtButton.html
You can define a listener for the form's submit button and then do whatever you want to do in your listener function
In all conditions you can have access to the form's elements and their values by their id

How can I can set which submit button is fired on enter?

I have a form with several submit buttons. I want my last button to handle the submit rather than the HTML5 spec'ed first button.
I can't change the html at this point and am fairly sure this requires JS. But when I've given it a shot I've gotten into nasty loops or dead code trying to prevent default behaviour and then fire my other button.
Has anyone done this before? jQuery is on the page if needed.
Thanks,
Denis
Since you mentioned jQuery :)
If all you want to do is submit your form when a user presses the enter key, then
$(function() {
$('body').keypress(function(e) {
if (e.which == 13) {
e.preventDefault();
$('#myForm').submit();
}
});
});
However, if you have different behavior/forms depending on which button is clicked and you want the enter key to trigger your last button's click event, then
$(function() {
$('body').keypress(function(e) {
if (e.which == 13) {
e.preventDefault();
$('input[type="submit"]:last').click();
}
});
});
You should just change the input element's type attribute to button instead when you don't want it to submit the form. (I know you said you can't really change the HTML, but this is the best way)
<input type="button" name="mybutton" class="submit-button" value="I wont submit!" />
jQuery code:
$('.submit-button').click(function() {
$('#secret-value-field').val($(this).val());
$(this).parents('form').submit();
});
Or something along those lines.