[jQuery] Re: Best way to Toggle
Oh God, it runs.
Thank you!!
On 5 Gen, 16:35, Eric \Hobo\ Garside gars...@gmail.com wrote:
Try:
$(':checkbox').click(function(){
$(this).parents('fieldset').next('fieldset').slideToggle();
});
.parent() has a limited scope and will return only the parent
elements. In the example you gave, fieldset is not a parent of
input, but an ancestor. .parents() with the s at the end will do
an ancestral search, not just a parental search.
The .next() will return us the next sibling to the current element,
which in the example would be fieldset#id_2
So just to walk thru it real quickly:
$(this) // The checkbox getting clicked
.parents('fieldset') // Fieldset#id_1, which contains the
checkbox
.next('fieldset') // Fieldset#id_2, which is the next fieldset
adjacent to Fieldset#id_1
.slideToggle() // Applied to the last element returned from the
jQuery chain, which is Fieldset#id_2
On Jan 5, 9:33 am, daweb davideprevo...@gmail.com wrote:
Hi everybody and sorry about my English!
This is my markup:
fieldset id=id_1
dl class=campo-esteso
dtnbsp;/dt
dd
input name=flag type=checkbox class=flag id=flag value=on
tabindex=1 /
span class=opzionaleToggle?!?!/span
/dd
/dl
/fieldset
fieldset id=id_2 // this fieldset is hidden
Some input text type
/fieldset
I have 3 similar checkbox field next. What about the best way to
toggle the next fieldset element.
I'd try this, but it doesn't works:
$(':checkbox').click(function(){
$(this).parent('fieldset').slideToggle();
});
Thank you all.
[jQuery] Best way to Toggle
Hi everybody and sorry about my English!
This is my markup:
fieldset id=id_1
dl class=campo-esteso
dtnbsp;/dt
dd
input name=flag type=checkbox class=flag id=flag value=on
tabindex=1 /
span class=opzionaleToggle?!?!/span
/dd
/dl
/fieldset
fieldset id=id_2 // this fieldset is hidden
Some input text type
/fieldset
I have 3 similar checkbox field next. What about the best way to
toggle the next fieldset element.
I'd try this, but it doesn't works:
$(':checkbox').click(function(){
$(this).parent('fieldset').slideToggle();
});
Thank you all.
[jQuery] Autopopulate multiple select plugin question
Hi everybody,
I'm using the plugin in object to autopopulate a multiple select. It
works nicely.
Now, I would want to select (selected=selected) the right item when
I reload the page.
I have this:
if (@$this-input-post('ajaxSelectChoose')) {
$query = $this-set-list_active_items('typologies', $this-
input-post('category'), 'url');
// this read the items from a database
$json = array();
foreach($query-result() as $row)
{
$json[] = '{id : ' . $row-id . ', label : ' .
$row-name .
'}';
}
die ('[' . implode(',', $json) . ']');
}
How can I select pre-select an option that is contained in a db row?
I have this:
$json[] = '{id : ' . $row-id . ', label : ' . $row-name .
'}';
something like {selected: selected=selected}
Regards guys
[jQuery] Jeditable + Json + Multiple Select
Hi everybody,
excuse my bad english...
I'm using jEditable plugin, it works fine, but I have a little
question...
I have to use it with a dynamic set of select input type.
This is my PHP code with the Json string:
{
message:
dl
dt1/dt
dd
div class=\optionsList\h4First/h4
span class=\clickOnThisSelect\ id=\select_1\Value One/span/
div
div class=\optionsList\h4Second/h4
span class=\clickOnThisSelect\ id=\select_2\Value Two/span/
div
div class=\optionsList\h4Third/h4
span class=\clickOnThisSelect\ id=\select_18\Value Three/span/
div
/dddt
/dl,
selectmessage: {
select_1: [ {'1':'Laminato', '2':'Cotto', '3':'Parquet', '4':'Marmo',
'5':'Granito', '6':'Cemento', '7':'Terracotta' } ] ,
select_2: [ {'8':'Stile Moderno', '9':'Stile Rustico', '10':'Stile
Barocco', '11':'Stile Country', '12':'Stile Classico' } ] ,
select_18: [ {'13':'Angela', '14':'Donato' } ] }
}
and this is the Js code in which I'm trying to use the plugin:
$(.clickOnThisSelect).editable
(?=site_url('admin/entries/update_options/'.$this-idEntryCod)?,
{
indicator : img src='?=site_url('assets/images/icons/loader.gif')?
',
tooltip : ?=$this-lang-line('clickToEdit')?,
name : newvalue,
id : elementid,
data : data.selectmessage.select_1[0], **
type : select,
onblur: cancel,
submit : OK,
cssclass : clickOnThisSelect
});
**
How can I dinamically change data.selectmessage.select_1[0] whit
data.selectmessage.n[0]? Is it possible?
Please, anyone can help me?
Thank you, regards to all.
Daweb
[jQuery] Re: Jeditable + Json + Multiple Select
Thank for reply Mika.
Try to explain my issue. I have x number of select input type,
generated from a db query.
With an ajax call I print the select fields into the page, without
page reload obviously.
Now i wanna use your plugin to edit this select fields but I can't set
the data options with the right values. The Json string is:
selectmessage: {
select_1: [ {'1':'Laminato', '2':'Cotto', '3':'Parquet',
'4':'Marmo',
'5':'Granito', '6':'Cemento', '7':'Terracotta' } ] ,
select_2: [ {'8':'Stile Moderno', '9':'Stile Rustico', '10':'Stile
Barocco', '11':'Stile Country', '12':'Stile Classico' } ] ,
select_18: [ {'13':'Angela', '14':'Donato' } ] }
}
This code is to generate the data values dinamically
and { message: span id=select_1My selected value/span }
[...] This code is to generate the select input fields
I don't know how to pass the right data value to the right select
field.
tooltip : ?=$this-lang-line('clickToEdit')?,
name : newvalue,
id : elementid,
data : data.selectmessage.select_1[0] ?
I wanna change select_1 with the right value, with the id select in
which i put my mouse. Understand?
I know It's not clear in english... ahhrrgg please help me! I know
this is so simple for you... but not for me
[jQuery] .clone issue with IE
Hi everybody,
I'm sorry for my English...
I'm trying to add a new table row (tr) after an ajax call.
My code works perfectly with FF or Opera, but not with IE.
With the right browsers I can add multiple row, IE instead overwrite
my first row (with right content but overwrite the last inserted).
This is my code after an ajax call which insert a new record in a DB
table:
function processJson(data) {
// 'data' is the json object returned from the server
$(#responceRow).clone(true).prependTo(#dataTables);
$(#addImage).html('a href=?=site_url('admin/settings/
select_typologies_options')?/'+ data.newId+'/a');
$(#responceRow).fadeIn();
$(#newId).html(data.newId);
$(#newName).html(data.newName);
$(#newUrl).html(data.newUrl);
$(#newCreated).html(data.newCreated);
$(#newLastedit).html(data.newLastedit);
$(#newStatus).html(data.newStatus);
}
/script
[...]
tr id=responceRow
td class=tableCellNew id=newIdnbsp;/td
td class=tableCellNew id=newAdd
div id=addImage
?='span' . $this-lang-line('actionAddDetails') . '/span'?
/div
/td
td class=tableCellNew id=newNamenbsp;/td
td class=tableCellNew id=newUrlnbsp;/td
td class=tableCellNew id=newCreatednbsp;/td
td class=tableCellNew id=newLasteditnbsp;/td
td class=tableCellNew id=newStatusnbsp;/td
td class=tableCellNew id=newCheckbox
input class=checkbox type=checkbox name=toggle[] /
/td
/tr
Have u any idea?
Many Thanks
[jQuery] An issue with .clone(true) and IE 6+
Hi everybody,
I'm sorry for my English...
I'm trying to add a new table row (tr) after an ajax call.
My code works perfectly with FF or Opera, but not with IE.
With the right browsers I can add multiple row, IE instead overwrite
my first row (with right content but overwrite the last inserted).
This is my code after an ajax call which insert a new record in a DB
table:
function processJson(data) {
// 'data' is the json object returned from the server
$(#responceRow).clone(true).prependTo(#dataTables);
$(#addImage).html('a href=?=site_url('admin/settings/
select_typologies_options')?/'+ data.newId+'/a');
$(#responceRow).fadeIn();
$(#newId).html(data.newId);
$(#newName).html(data.newName);
$(#newUrl).html(data.newUrl);
$(#newCreated).html(data.newCreated);
$(#newLastedit).html(data.newLastedit);
$(#newStatus).html(data.newStatus);
}
/script
[...]
tr id=responceRow
td class=tableCellNew id=newIdnbsp;/td
td class=tableCellNew id=newAdd
div id=addImage
?='span' . $this-lang-line('actionAddDetails') . '/span'?
/div
/td
td class=tableCellNew id=newNamenbsp;/td
td class=tableCellNew id=newUrlnbsp;/td
td class=tableCellNew id=newCreatednbsp;/td
td class=tableCellNew id=newLasteditnbsp;/td
td class=tableCellNew id=newStatusnbsp;/td
td class=tableCellNew id=newCheckbox
input class=checkbox type=checkbox name=toggle[] /
/td
/tr
Have u any idea?
Many Thanks
[jQuery] Re: jquery.validation and ajax
Thank you for reply.
Now, the validation plugin run fine. The Ajax Call run too, because
the record I intend to save, is in my DB correctly, but..
It returns this error: uncaught exception: [object Object]
This is my complete js code, included in commenti.js (I also include
jquery.js and jquery.validation.js)
$().ready(function() {
jQuery(function() {
show a simple loading indicator
var loader = jQuery('div id=loadingDivimg src=/operamage/
assets/operamage/images/icone/loadingAnimation.gif alt=loading... /
/div')
.css({position: relative, top: 1em, left: 25em})
.hide()
.appendTo(body);
jQuery().ajaxStart(function() {
loader.show();
}).ajaxStop(function() {
loader.hide();
});
jQuery().ajaxError(function(a, b, e) {
throw e;
});
jQuery.validator.setDefaults({
debug: false,
rules: {
nominativo: { required: true, minLength: 2 },
localita: { required: true, minLength: 2 },
messaggio: { required: true, minLength: 2 }
},
messages: {
nominativo: p class=\error\Inserisci il tuo
Nominativo/p,
localita: p class=\error\Inserisci la Localitagrave; di
provenienza/p,
messaggio: p class=\error\Inserisci il tuo Messaggio/p
}
});
var v = jQuery(#form_inserisci_commento).validate({
submitHandler: function(form) {
jQuery(form).ajaxSubmit({
dataType: json,
after: function(result) {
if(result.status) {
v.showErrors(result.data);
v.focusInvalid();
}
}
});
}
});
jQuery(#reset).click(function() {
v.resetForm();
});
});
});
[jQuery] Re: jquery.validation and ajax
I've tried this solution, but nothing to do for me... umphf!!
$().ready(function() {
// validate signup form on keyup and submit
$('#form_inserisci_commento').ajaxForm({
beforeSubmit:
function() {$(#form_inserisci_commento).validate({
event: keyup,
rules: {
nominativo: { required: true, minLength: 2 },
localita: { required: true, minLength: 2 },
messaggio: { required: true, minLength: 2 }
},
messages: {
nominativo: p class=\error\Inserisci il tuo
Nominativo/p,
localita: p class=\error\Inserisci la Localitagrave; di
provenienza/p,
messaggio: p class=\error\Inserisci il tuo Messaggio/p
}
})},
target: '#successDiv',
// success identifies the function to invoke when the server
response
// has been received; here we apply a fade-in effect to the new
content
success: function() {
$('#inserisci_commenti').fadeOut('slow');
//$('#loadingDiv').show();
$('#successDiv').fadeIn('slow');
var t=setTimeout($('#successDiv').fadeOut();, 1);
}
})
});
The issue is that ajax call works but not the validation. I want call
ajax if the form is valid...
On May 22, 3:02 pm, Richard Worth [EMAIL PROTECTED] wrote:
On 5/22/07, daweb [EMAIL PROTECTED] wrote:
...
$('#successDiv').fadeIn('slow');
}
}),
$(#form_inserisci_commento).validate({
...
I don't know if this is the problem, but the first thing that jumps out to
me is the comma ( , ) above should be a semi-colon ( ; ).
- Richard D. Worth
