Adding jquery script to two buttons

[JanMolendijk]

Dear admin I try to add two buttons in one off your scripts for opening via button
but i cant find out what i`m doing wrong one is opening but btn_notice_id_1 is not

Code: Select all

<button class="btn_notice_id_1" id_1="btn_1'. $row['id_2'] .'">Show Comments</button>
<button class="btn_notice_id" id="btn_'. $row['id_2'] .'">Add Reply</button>

<div id_1="idd_1'. $row['id_2'] .'" style="display:none;">
<iframe src="http://145.53.93.209/comments/user/User-Shout-Anonymous-Reply.php?id='. $row['post_from_id']. '&notice_id='. $row['id_2'] .'"
width="100%" height="100%" frameborder="0" scrolling="yes"
align="top" marginwidth="0" marginheight="0" name="offtopic">
</iframe>
</div>

<div id="idd'. $row['id_2'] .'" style="display:none;">
<iframe src="http://145.53.93.209/comments/user/User-Shout-Anonymous-Reply.php?id='. $row['post_from_id']. '&notice_id='. $row['id_2'] .'"
width="100%" height="100%" frameborder="0" scrolling="yes"
align="top" marginwidth="0" marginheight="0" name="offtopic">
</iframe>
</div>

Code: Select all

<script type="text/javascript">
$(document).ready(function() {
$('.btn_notice_id').on('click', function(){
var btn_id = $(this).attr('id');
$('#idd'+btn_id.replace('btn_', '')).show('slow', function() {
$('#'+btn_id).hide(650);
});
});
});
</script>

<script type="text/javascript">
$(document).ready(function() {
$('.btn_notice_id_1').on('click', function(){
var btn_id_1 = $(this).attr('id_1');
$('#idd_1'+btn_id.replace('btn_', '')).show('slow', function() {
$('#'+btn_id).hide(650);
});
});
});
</script>

Hello,
There is no attribute "id_1". You can change the value of an atribute, but not its name.
You can use the same js script for multiple buttons; just apply the js event to their "class".
- Try this in your code:
HTML:

Code: Select all

<button class="btn_notice_id_x" id="btn_x'. $row['id_2'] .'">Show Comments</button>
<button class="btn_notice_id" id="btn_'. $row['id_2'] .'">Add Reply</button>
<div id="iddx'. $row['id_2'] .'" style="display:none;">
<iframe src="/comments/user/User-Shout-Anonymous-Reply.php?id='. $row['post_from_id']. '&notice_id='. $row['id_2'] .'"
width="100%" height="100%" frameborder="0" scrolling="yes"
align="top" marginwidth="0" marginheight="0" name="offtopic">
</iframe>
</div>

- JavaScript:

Code: Select all

<script type="text/javascript">
$(document).ready(function() {
$('.btn_notice_id, .btn_notice_id_x').on('click', function(){
var btn_id = $(this).attr('id');
$('#idd'+btn_id.replace('btn_', '')).show('slow', function() {
$('#'+btn_id).hide(650);
});
});
});
</script>