Disable Button When Checkbox = Unchecked In Cgridview

Hello, it’s me again.

This is my admin.php:


<?php $form=$this->beginWidget('CActiveForm', array(

	'id'=>'satu-form',

        'action'=>array('TabelAlumni/deleteBanyak'),

	'enableAjaxValidation'=>true,

)); ?>


<?php $this->widget('zii.widgets.grid.CGridView', array(

        'id'=>'tabel-alumni-grid',

        'dataProvider'=>$model->search(),

        'filter'=>$model,

		'selectableRows'=>2,

        'columns'=>array(

                array(

			'id'=>'autoId',

			'class'=>'CCheckBoxColumn',

		),

				

                'username',

        ....

)); 

?>

<?php echo CHtml::submitButton('Delete All'); ?>

<?php $this->endWidget(); ?>

As you can see, i have CheckBox in CGridView.

So my question is, how to disable the submit button (Delete All) when the CheckBox is unchecked or none have checked??

Thank you.

First, you need to give an ID to ‘Delete All’ button, say it ‘delete_all’.

Second, learn the way mentioned in this link http://www.yiiframework.com/forum/index.php/topic/46741-cgridview-ccheckbox-ajax-update-onchange/. It’s not similar with your objective but you can learn the approach.

Third, you can use


$('#delete_all').hide();

to hide the ‘Delete All’ button after you define what you need based on the second step above.

Hey you again, thank you for your reply.

This is what i got, but still not working:

  • Should be used to get checked rows :

$(gridID).yiiGridView('getChecked', columnID)

  • To give id on submit button:

echo CHtml::submitButton('Delete Banyak', array('id'=>'btnSubmit'));

  • Now i try this but still not working, sorry i am to newbie at javascript

<script>

	var checker = $(tabel-alumni-grid).yiiGridView('getChecked, autoId');

	var deletebtn = document.getElementById('btnSubmit');

	checker.onchange = function()

	{

		if(checker.count > 0){

			deletebtn.disabled = true;

		} else {

			deletebtn.disabled = false;

		}

	}

</script>

Please help me…

Watch your selectors.

For example, this


$(tabel-alumni-grid)

is wrong. If "tabel-alumni-grid" is element ID, you need to use


$('#tabel-alumni-grid')

More on selectors: http://api.jquery.com/category/selectors/

I have researched a lot, i found this:

  • var checked=$("#tabel-alumni-grid").yiiGridView("getChecked","autoId");

  • count=checked.length;

  • $(’#deletebtn’).attr(“disabled”, true);

But i still confused to put them together into javascript. :(

This is really2 like of my Question. But no solution at there.

This is my full script:


<?php $this->widget('zii.widgets.grid.CGridView', array(

        'id'=>'tabel-alumni-grid',

        'dataProvider'=>$model->search(),

        'filter'=>$model,

	'selectableRows'=>2,

        'columns'=>array(

                array(

			'id'=>'autoId',

			'class'=>'CCheckBoxColumn',				

		        'htmlOptions'=>array('onclick'=> 'fn_onclick()'),

		),		

               ...

)); 

?>

<?php 

	echo CHtml::submitButton('Delete Banyak', 

	array(

		//'id'=>'btnSubmit',

		'class'=>'button',

		'disabled'=>'true',

	)); 

?>


<script>

$("#tabel-alumni-grid[type=checkbox]").click(function()

	{

	   if($("#tabel-alumni-grid").find("input:checked").length >0)

		  $(".button").removeAttr("disabled");

	   else

		  $(".button").attr("disabled","true");

});

</script>

<?php $this->endWidget(); ?>

The Submit Button is being shown (disabled) but after clicking on any checkbox it is not getting enabled.

Can anyone find the wrong part of my script??

Try this jquery…

To disable the element(s) using class selector


$('.button').prop('disabled', true);

To enable the element(s) using class selector


$('.button').prop('disabled', false);

Still not working. ;(

You have to check which part of javascript or jquery cannot be executed.

If you use Firefox or Chrome as your browser, try using Firebug. Perhaps, it will give you whic part of javascript or jquery is incorrect.

I am using firebug and i can’t find any problem.

By the way, do you have try your solution above, bogel??

Hi nashrul,

I’m using the


prop('disabled', true)

in my codes. It always works.

Try to change the property of your button


'disabled'=>'true'

to


'disabled'=>'disabled',

If it doesn’t still work, try to change:


 

array(

    //'id'=>'btnSubmit',

    'class'=>'button',

    'disabled'=>'true',

); 



to




array(

    'id'=>'btnSubmit',

    'disabled'=>'disabled',

); 



To disable the button, use


$('#btnSubmit').prop('disabled', true);

To enable the button, use


$('#btnSubmit').prop('disabled', false);

Like this right?:


<?php 

	echo CHtml::submitButton('Delete Banyak', 

	array(

		'id'=>'btnSubmit',

		'disabled'=>'disabled',

		'name' => 'deleteBanyak', 

		'title' => 'Silahkan memilih data mana yang ingin dihapus',

	)); 

?>

<script>

$("#tabel-alumni-grid[type=checkbox]").click(function()

	{

	   if($("#tabel-alumni-grid").find("input:checked").length >0)

		  $('#btnSubmit').prop('disabled', false);

	   else

		  $('#btnSubmit').prop('disabled', true);

});

</script>

Still not working :(

Maybe there is something wrong at this:


<?php $this->widget('zii.widgets.grid.CGridView', array(

        'id'=>'tabel-alumni-grid',

        'dataProvider'=>$model->search(),

        'filter'=>$model,

		'selectableRows'=>2,

        'columns'=>array(

                array(

					'id'=>'autoId',

					'class'=>'CCheckBoxColumn',				

					'htmlOptions'=>array('onclick'=> 'fn_onclick()'),

				),

        ....

Oh… I missed something in your code. You don’t need this one:


'htmlOptions'=>array('onclick'=> 'fn_onclick()'),

Just remove from your code.

Hello bogel, still not working.

Look at this: