0

Hi again :)
I'm using jQuery script to show/hide some content:

<script type="text/javascript">
$('.toggleButton').click(function() {
    var id = this.id.replace('toggleButton', '');
    $('#content' + id).toggle();
});
</script>

Since I'm using PHP, I am iterating through few items and each of them has a button to show/hide its content. My content is actually a form with few input fields. In each item, first field of my form has a same name (let's say 'line1').
What I would like to do is when I click on an item and open its content, to take a focus on input field 'line1'. When I click on other item to take a focus on its 'line1' field, and so on...
Preferably with jQuery because I suppose it would be simpler, but javascript solution would be also great :)

Thanks for any help!

EDIT: I will attach a part of code which is that I need to show and hide... Maybe it will be of some help... I am using codeigniter, so not to be confused by some functions :)

echo "<div class=\"toggleButton\" id=\"toggleButton".$item['id']."\">CLICK TO OPEN</div>";
echo "<div class=\"content\" id=\"content".$item['id']."\" style=\"display:none;\">";
echo form_open('title/add'); // codeigniter's open form
for ($i = 1; $i <= $item['rows']; $i++) {
    echo "<input type=\"text\" class=\"line\" id=\"line".($i)."\">".br();
}
echo form_submit('submit', 'submit'); // codeigniter's submit for button
echo "</form>";
echo "</div>";
errata
  • 5,695
  • 10
  • 54
  • 99
  • thanks for edit ninja dude :) i have that line correctly written in my script, seems it was just a typo here... – errata Nov 07 '10 at 12:19

2 Answers2

3

Change your last line to:

$('#content' + id).toggle().find('input').first().focus()
Jon
  • 16,212
  • 8
  • 50
  • 62
  • Thanks for help but for some reason this ultra-simple and logical solution won't work in my case :( Do you have some idea why this is not working? – errata Nov 06 '10 at 00:39
  • http://stackoverflow.com/questions/2780288/jquery-validation-using-the-class-instead-of-the-name-value – zod Nov 06 '10 at 01:32
  • ok, I 'upgraded' jQuery version and now it works as expected... Thanks! – errata Nov 08 '10 at 01:39
0

did you try giving common class name and call function based on class name

zod
  • 12,092
  • 24
  • 70
  • 106
  • I'm not sure what do you mean, I'm total noob in jQuery... All my divs have 'class' attribute and I have tried this: $('.content').find('input').first().focus(); but this won't work either... – errata Nov 06 '10 at 01:11
  • hello zod and thanks for help! unfortunately this solution is not working either :( i have tried few combinations - for example, $('.content').find('input').focus(); will focus each 'submit' button in my forms. $('#line1').focus(); will focus correctly but only when i show first hidden div... in second one, third and so on, line1 will not be focused. $('.line').focus(); will focus each LAST input field in my forms... but i cannot make it to focus on first field, no way :( what am i doing wrong here?? – errata Nov 07 '10 at 12:15