I am trimming all textboxes and textareas on submit. It does not work for all view pages.
I have taken simple html inputs + kendo DropDownList + kendo AutoComplete in my form.
Below is my submit method which doesn't work, when there are Kendo UI control on my form.
$('input[type="submit"]').click(function () {
$('input[type=text], textarea').each(function () {
if($(this).val()!=''){
$(this).val($.trim($(this).val())); //Exception in chrome: paused on exception typeerror. Msg: undefined in not function.
}
});
});
I don't know what's wrong. I found this issue specific to chrome browser.
It it just the kendo controls? Their DropDownList for instance renders this (from the demo)
<input id="color" value="1" data-role="dropdownlist" style="display: none;">
Note there is no type=text attribute so your selector is probably not including this.
It seems there is no problem in your normal HTML and Js code. Check other piece of codes in your project, Weather its blocking your code.
Probably check the Kendo UI Syntax / Format / Attributes for Html
controls. It might be a problem.
Take a look at my fiddle workout. I have Tested its working fine.
There is no exception Like -- //Exception in chrome: paused on exception typeerror
I don't know what's wrong. So I updated the function as below:
$('input[type="submit"]').click(function () {
$('#textbox1,#textbox2,#textarea1').each(function () {
if($(this).val()!=''){
$(this).val($.trim($(this).val()));
}
});
});
I wrote ids of all textboxes and textarea which I need to trim inside each. And it works fine. But still I have question why generalize function didn't work.
Related
I am new to Javascript and am trying to make a Javascript .click function. Upon clicking button id #btnTransfer, I want it to check against the listed account id value(s) and throw an error message if it matches a listed value. Here is the code im using. The user's input id #accountid is already printed on the webpage via asp, but is hidden from view. Any help would be greatly appreciated :)
$('#btnTransfer').click(function () {
if ($('#accountid').val() == "123456789") {
popError("Error you cannot preform this action");
}
your code is write https://api.jquery.com/click/ i dont understand what u really want to do explain me more or give us more code
You are missing a closing brace and closing parenthesis. Once those syntax issues are fixed and the reference to jQuery included, it works exactly as you said you wanted it to. I don't know what your popError function is like, so I just have it displaying an alert.
function popError(message) {
alert(message);
}
$('#btnTransfer').click(function () {
if ($('#accountid').val() == "123456789") {
popError("Error you cannot preform this action");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" id="btnTransfer">Transfer</button>
<input type="hidden" id="accountid" value="123456789" />
I am trying to do something very simple. If you go to http://cutecuttingboards.com/product/apple/, I simply want to hide the "From:" price after the user choose a size in the drop down menu. I am trying the code below, which is working fine in Fiddle but not on the live site:
jQuery('#size').on('change', function(){
jQuery('p.price').hide();
});
Here is the fiddle with unformatted code: http://jsfiddle.net/anneber/U2Mat/
Any help is much appreciated!
Anne
i know it's kind of late but.. in case someone else is having the same problem, this should do the trick:
jQuery(document).ready(function($) {
$(document).on("change", ".variations #size", function() {
$('p.price').hide();
});
});
If I copy/paste your code above into web inspector and then change the selection it works, so most likely, the code is either not in the page, not being run, or being run before the related elements have been loaded into the DOM.
There is an error in your cutecutb.js file the Unterminated comment. i.e you are not terminating the comment
There is no "*/" sign.
EDIT :
Now another reason in add-to-cart-variation.min.js there is already an onchange event of dropdown
You can see you "#size" element is inside ".variations" class
I have an application built in Html5 and wrapped in PhoneGap for Android
I have an auto-complete input
On a computer auto-complete input works great!
In SmartPhone, the auto-complete works only after you make space on the Input
(If write numbers first - works! If letters - works only after space)
Why?
JS code:
//Run in document.ready
function AutoComplete() {
List = $.map(data.XXX, function (item) {
return {
label: item.X,
value: item.XX
};
});
$("#MyInput").autocomplete({
source: List,
link: '#',
target: $('#MyList'),
minLength: 1
});
}
HTML:
The input:
<input id="MyInput" type="text"
placeholder="XXX" />
The List:
<ul id="MyList" data-role="listview" data-inset="true"> </ul>
Try adding autocomplete="off" to the input tag.
I am not sure ,but try after giving
minlength :0
and execute the autocomplete on keypress
may be this will give u output.
have a look at these links also
link1
link2
I think this link solves your issue showing how to Getting jQueryUi Autocomplete to work with jQueryMobile
This answer allows you to use autocomplete function of jQuery on jQueryMobile solutions.
'oninput' event in the input, ran the following function:
function RefreshAutoComplete(elm) {
elm.keyup();
elm.focus();
}
I run the auto complete manually, and it works
Thank you all for the help
After performing an ajax request if the input in the form was wrong I am trying to get this validatationTextBox to be focussed on and display an indicator message showing the problem.
The code is:
dijit.byId("passwordField").focusNode.focus()
The form element is as mentioned a validationTextBox.
The matter that is confusing me even further is that before in dojo 1.5, this piece of code was simply dijit.byId("passwordField").focus() and this worked fine. How can I fix this?
I have also tried :
require(["dijit/focus"],function(focusU){
focusU.focus(dojo.byId("ID"));});
But this does not work either.
If the dijit.widget.focus() fails, then the _FocuxMixin is not loaded properly during its startup.
With any dijit.form.Type, you should be able to successfully gain focus via:
dijit.byId('ID').focus();
I think youre confusing DOM event focus with widget focus handling. If you fire widget.focusNode.focus - you will not benifit from the messaging in ValidationTextBox in any browser.
Can you try something like this in the form tag:
<script language="javascript" type="text/javascript">
Sys.Application.add_load
(
function () {
window.setTimeout(focus, 1);
}
)
function focus() {
if (document.getElementById('txtComm1') != null) {
if (document.getElementById('txtComm1').disabled != true) {
document.getElementById('txtComm1').focus();
}
}
}
</script>
If your form fields are inside a dijit/Dialog, the Dialog will automatically focus on the first input. You can disable this behaviour by setting:
autofocus: false
on the Dialog, after which,
widget.focus();
should work fine.
This worked for me...
setTimeout(function(){
widget.focus();
}, 100);
I am using this jquery plugin for called tokeninput it's for autosuggestion when typing:
the code here generates the autosuggestion for the input box:
$("#input-auto").tokenInput("topicGet.php", {
theme: "facebook"
});
but when I try to append the input which uses the #input-auto it does not do the autosuggestion but it works when it's loaded on the page:
the code is here:
$('.topicEdit').live('click', function() {
$('#Qtopics').html('<input type="text" id="input-auto" />');
I'm trying to solve the problem, but I can't find anything, I also tried to put the live click on the .topicEdit, but it's still not working. :)) thanks
Looks like you're probably initializing the autosuggestion BEFORE you add the input into the DOM. You have to remember that jQuery is stupid, and only does things in the order that you tell it. When you initially 'generate' the autosuggestion, if it can't find it in the DOM at that moment, it won't do anything! So, to solve your problem, you'll want to do the generation of the autosuggest after you insert it into the DOM:
$('.topicEdit').live('click', function() {
$('#Qtopics').html('<input type="text" id="input-auto" />');
$("#input-auto").tokenInput("topicGet.php", {
theme: "facebook"
});
});
yay?
Calling tokenInput on page load when input-auto doesn't yet exist is your problem.
$('.topicEdit').live('click', function() {
$('#Qtopics').html('<input type="text" id="input-auto" />');
$("#input-auto").tokenInput("topicGet.php", {
theme: "facebook"
});
});
I'm not exactly sure what the problem is, but try using livequery plugin. You don't need to specify an event to it, just a function which will run for all current and future elements that match the selector.
Example:
$(".something").livequery(function () {
// do something with the element
}