I have 10 buttons that are created when click button "Create".
How to also click all those buttons when i click "Create" ?
function a() {
selectAll();
jQuery(selectAllValues());
};
function selectAllValues() {
for(var i = 0; i < array.length; i++) {
document.getElementById("select" + array[i]).click();
}
};
The problem is that the buttons are created but not clicked.
Just use Jquery like this :
$("#select" + array[i]).click();
Or without loop : http://api.jquery.com/attribute-starts-with-selector/
//Will execute the click event on all element where the id begins by "select"
$('[id^="select"]').click();
Why do you want to click them all? Are these actually checkboxes that you are trying to mark as "Checked"?
//If checkboxes then try
$('#select'+array[i]).prop('checked', true);
if these are truly buttons then why wouldn't you manually initialize the "onClick" function that they would initialize?
for(var i = 0; i < array.length; i++) {
//call the onClick function yourself here
}
Please elaborate
EDIT:
function selectAllValues() {
for(var i = 0; i < array.length; i++) {
$('#select'+array[i]).prop('checked', true);
//code to create tables
//loop through tables
$('tableselector').each(function(key,value){
//check the checkboxes within the tables
$(this).find('input[type="checkbox"]').prop('checked', true);
});
}
};
Related
This block of code verify if all of codes is checked. I am looking for a way to check if at least one of the codes is checked, instead.
function containsAny(needles, haystack){
for(var i = 0 , len = needles.length; i < len; i++){
if($.inArray(needles[i], haystack) == -1) return true;
}
return false;
}
I have a full working example here: http://jsfiddle.net/v7wt5eop/
How to see this behavior:
In the selectbox click Deselect All
Check A
Line 2 and 3 of the table should be unfaded because A is one of the codes
And the rows that are with the class row-disabled should be at the end of the table. I am using Bootstrap Sortable, but couldn't figure out how to do it. So everytime I click in an option in the selectbox it should re-order the table.
Your function containsAny should be
function containsAny(needles, haystack){
for(var i = 0 , len = needles.length; i < len; i++){
if($.inArray(needles[i], haystack) != -1) return false;
}
return true;
}
To sort every time you check/uncheck
$('.selectpicker').on('change', function() {
var list = [];
$('.selectpicker :selected').each(function(i, selected) {
//Removed the irrelevant codes
});
$('.CodeCheck').each(function() {
//Removed the irrelevant codes
});
el = $(".table tbody tr.row-disabled:first-child");
$(".table tbody tr").not(".row-disabled").each(function() {
$(this).insertBefore(el);
});
});
I'm dynamically setting buttons to the jQuery UI dialog like below.
arrButton = {};
var i = 0;
for (i = 0; i < dialog_buttons.length; i++) {
for (var key in dialog_buttons[i]) {
arrButton[key] = {
id: key,
text: dialog_buttons[i][key],
click: function () {
test($('#' + key));
}
};
}
}
function test(value) {
if (value.selector == "#confirm") {
confirmthis();
}
if (value.selector == "#cancel") {
cancelthis();
}
}
$("#" + div.id).dialog({
modal: true,
buttons: arrButton
});
when the button clicked, the key will be the last value from the iteration. Let's say we have keys confirm and cancel then when the button is clicked, the key parameter will be cancel.
So when I click a button from the dialog, I want to know which button was pressed.
Please find the fiddle which duplicates the issue I described above.
http://jsfiddle.net/DOmEl/qNGEw/11/
This contains a nested dialog which in turn trigger when clicked either Yes Or No of first dialog.
When the second dialog appear, both button have no effect.
why you are not using this ?
click: function () {
test($('#' + jQuery(this).attr('id')));
}
I have a scenario where a RadioButtonList needs to be in disabled mode by default and then on some event on client side, say, when a checkbox is checked, it needs to be enabled.
But once I disable it from code-behind, the javascript part of enabling it doesn't work.
Am I missing something or is it not possible?
Try this:
function Test()
{
var controlObject = document.getElementById('RadioButtonList1');
controlObject.removeAttribute('disabled')
RecursiveDisable(controlObject);
return false;
}
function RecursiveDisable(control)
{
var children = control.childNodes;
try{control.removeAttribute('disabled')}
catch(ex){}
for (var j = 0; j < children.length; j++) {
RecursiveDisable(children[j]);
//control.attributes['disabled'].value = '';
}
}
taken from: http://forums.asp.net/t/1259735.aspx
Hope this helps
Is there a way to check a form before submitting it to see if ANY of the checkboxes have been checked in Javascript?
Something like...
function checkboxcheck(){
/*something in here to check name="brands[]" checkbox array?*/
}
Basically I just want it to alert me if 0 checkboxes were selected. 1 or more is required.
I would call this function on submit.
Thanks much!!
You could do something like this:
function anyCheckboxesChecked() {
var inputs = document.getElementsByTagName('input');
for (var i = 0; i < inputs.length; ++i) {
if (inputs[i].type === "checkbox" && inputs[i].checked)
return true;
}
return false;
}
Then you could call that function from your "submit" handler"
if (!anyCheckboxesChecked()) {
alert("Please check one of the appealing checkboxes on the page");
return false;
}
If your page is more complicated than what this implies (like, if there are multiple forms), then you'd find the appropriate form first and call .getElementsByTagName() from that point instead of from document.
How about:
function checkboxcheck(name) {
var els = document.getElementsByName(name);
for (var i = 0; i < els.length; i++) {
if (els[i].checked) {
return true;
}
}
return false;
}
using getElementsByName().
Usage:
var valid = checkboxcheck("brands[]");
Here's an example: http://jsfiddle.net/andrewwhitaker/2saJp/1/
I have the following snippets of code. Basically what I'm trying to do is in the 1st click function I loop through my cached JSON data and display any values that exist for that id. In the 2nd change function I capturing whenever one of the elements changes values (i.e. yes to no and vice versa).
These elements are all generated dynamically though the JSON data I'm receiving from a webservice. From my understanding that is why I have to use the .live functionality.
In Firefox everything works as expected (of course). However, in IE7 it does not. In IE7, if I select a radio button that displays an alert from the click function then it also adds to the array for the changed function. However, if the radio button does not do anything from the click function then the array is not added to for the change.
As I look at this code I'm thinking that I might be able to combine these 2 functions together however, right now I just want it to work in IE7.
$(document).ready(function () {
//This function is run whenever a 'radio button' is selected.
//It then goes into the CPItemMetaInfoList in the cached JSON data
//($.myglobals) and checks to see if there are currently any
//scripts to display.
$("input:radio").live("click", function () {
var index = parseInt(this.name.split(':')[0]);
for (i = 0; i <= $.myglobals.result.length - 1; i++) {
if ($.myglobals.result[i].CPItemMetaInfoList.length > 0) {
for (j = 0; j <= $.myglobals.result[i].CPItemMetaInfoList.length - 1; j++) {
if (index == $.myglobals.result[i].QuestionId) {
alert($.myglobals.result[i].CPItemMetaInfoList[j].KeyStringValue);
return;
}
}
}
}
});
});
$(document).ready(function () {
var blnCheck = false;
//Checks to see if values have changed.
//If a value has been changed then the isDirty array gets populated.
//This array is used when the questionSubmit button is clickeds
$('input').live('change', function () {
blnCheck = false;
for (i = 0; i <= isDirty.length - 1; i++) {
if (isDirty[i] == $(this).attr("name")) {
blnCheck = true;
break
}
}
if (blnCheck == false) {
isDirty[arrayCount] = $(this).attr("name");
arrayCount += 1;
alert($(this).attr("name"));
}
});
$('textarea').live('change', function () {
blnCheck = false;
for (i = 0; i <= isDirty.length - 1; i++) {
if (isDirty[i] == $(this).attr("id")) {
blnCheck = true;
break
}
}
if (blnCheck == false) {
isDirty[arrayCount] = $(this).attr("id");
arrayCount += 1;
//alert($(this).attr("name"));
}
});
});
UPDATE:
I had to move this chunk of code into the click function:
blnCheck = false;
for (i = 0; i <= isDirty.length - 1; i++) {
if (isDirty[i] == $(this).attr("name")) {
blnCheck = true;
break
}
}
if (blnCheck == false) {
isDirty[arrayCount] = $(this).attr("name");
arrayCount += 1;
alert($(this).attr("name"));
}
Like this:
$(document).ready(function () {
//This function is run whenever a 'radio button' is selected.
//It then goes into the CPItemMetaInfoList in the cached JSON data
//($.myglobals) and checks to see if there are currently any
//scripts to display.
$("input:radio").live("click", function () {
var index = parseInt(this.name.split(':')[0]);
for (i = 0; i <= $.myglobals.result.length - 1; i++) {
if ($.myglobals.result[i].CPItemMetaInfoList.length > 0) {
for (j = 0; j <= $.myglobals.result[i].CPItemMetaInfoList.length - 1; j++) {
if (index == $.myglobals.result[i].QuestionId) {
alert($.myglobals.result[i].CPItemMetaInfoList[j].KeyStringValue);
return;
}
}
}
}
blnCheck = false;
for (i = 0; i <= isDirty.length - 1; i++) {
if (isDirty[i] == $(this).attr("name")) {
blnCheck = true;
break
}
}
if (blnCheck == false) {
isDirty[arrayCount] = $(this).attr("name");
arrayCount += 1;
}
});
});
But...
I had to leave the change function the same. From my testing I found that the .click function worked for IE7 for the radio buttons and checkbox elements, but the .change functionality worked for the textboxes and textareas in IE7 and FF as well as the original functionality of the radio buttons and checkbox elements.
This one got real messy. Thanks to #Patricia for looking at it. Here suggestions did lead me to this solution. I'm going to leave the question unanswered as I wonder if there isn't a cleaner solution to this.
Fact: change event on radio buttons and checkboxes only get fired when the focus is lost (i.e. when the blur event is about to occur). To achieve the "expected" behaviour, you really want to hook on the click event instead.
You basically want to change
$('input').live('change', function() {
// Code.
});
to
$('input:radio').live('click', functionName);
$('input:not(:radio)').live('change', functionName);
function functionName() {
// Code.
}
(I'd however also take checkboxes into account using :checkbox selector for the case that you have any in your form, you'd like to treat them equally as radiobuttons)
I think this is because IE fires the change when focus is lost on checks and radios. so if the alert is popping up, focus is being lost and therefor the change event is firing.
EDIT:
try changing the $('input') selector to $('input:not(:radio)')
so the click will fire for your radios and the change for all your others.
Edit #2:
How bout putting the stuff that happens on change into a separate function. with the index as a parameter. then you can call that function from the change() and the click(). put the call to that function after your done with the click stuff.
You're declaring your blnCheck variable inside one of your document.ready() functions. You don't need two of these either, it could all be in one.
This means that the variable that you're declaring there won't be the one used when your change function is actually called, instead you're going to get some kind of implicit global. Don't know if this is part of it, but might be worth looking at. You should declare this at the top of your JS file instead.