Alert message when checkbox is not selected - jquery-ui

Question

I am new to jquery and Jqgrid. I have problems displaying an alert message, when the checkbox is not selected in jqgrid, i.e i have declared the multiselect:true.
function initJqGridSearchSubProject(table,pager,msg,loadSelID,caption,chkMrk ){
$(table).empty();
$(table).GridUnload();
var mygrid =jQuery(table).jqGrid({
datatype: "local",
data:msg,
width: 1240,
scrollOffset:0,
height: 250,
colNames:['ID','PID','Project Folder Name','Sub Project Name','Responsible','Status','Last Updated On'],
colModel:[
{name:'id',index:'id',hidden:true, width:5, sorttype:"int", editable: false,resizable:false},
{name:'pid',hidden:true, width:5, sorttype:"int", editable: false,resizable:false},
{name:'projectFolderName', width:250, editable: true,formatter:'tsLinks'},
{name:'subProjectName', width:250, editable: true,formatter:'subProjectLinks'},
{name:'responsible', width:200, editable:false,resizable:false},
{name:'status', width:100,editable: true,stype:'select',edittype:"select",resizable:false,editoptions:{value:"ACTIVE:ACTIVE;INACTIVE:INACTIVE;DELETED:DELETED",readonly:false},editrules:{edithidden:false}},
{name:'lastUpdatedOn', width:200,editable: false,resizable:false,sorttype:'date',formatter:'date',formatoptions:{ srcformat: 'M d y H:i:s', newformat: 'd M y h:i A' }}
],
pager: pager,
rowNum:200,
rowList:[200,400,600,1000],
//rowTotal:2000,
//loadOnce:true,
//rownumbers:true,
gridview : true,
//sortname: 'lastUpdatedOn',
viewrecords: true,
//sortorder: "desc",
toppager:true,
multiselect:true,
singleselect: false,
//multiboxonly:true,
//toolbar: [true,'both'],
caption:caption,
hidegrid: false,
gridComplete:function(id){
//$(chkMrk).hide();
//alert('grid complete');
},
beforeSelectRow: function(rowid, e)
{
// reset check box selection only when user clicks on another checkbox
if($(e.target).is("input:checkbox"))
{
// reset/clear other checkboxes selection before making a latest clicked row's checkbox as selected
jQuery(table).jqGrid('resetSelection');
}
// Code To Disable Check Box Selection When User Selects by Clicking on A Row
return $(e.target).is("input:checkbox");
//return(true);
}
});
jQuery(table).jqGrid('navGrid',pager,{del:false,add:false,edit:false,search:false,refresh:true,cloneToTop:true,afterRefresh:function(){}},{},{},{},{});
jQuery(table).jqGrid('navButtonAdd', table+ '_toppager_left',{caption:"Add WO", buttonicon:"ui-icon ui-icon-plus",id:"SUBPROJID", onClickButton: function(){},position:"first",title:"Add WO"});
});
This is my whole code jqgrid...
I have a rows of fields with prjt names and subprjects names, where i use multiselect, to display the checkbox before the row for all fields, Its mandate that user should click one checkbox to show other page,where if user does not check, he should be shown an alert message to check any checkbox.

Answer 1

I hope that I undertand correct your requirements. You added custom button "Add WO" to the navigator bar and you need display alert message if no row is selected when the button are clicked or to redirect to another page if some row is do selected.
You can get the list of selected rows using $(this).jqGrid("getGridParam", "selarrrow") or using $(this).jqGrid("getGridParam", "selrow") inside of onClickButton, which will be called if the user click on the button. The internal parameter selrow represent the rowid of last selected row. If $(this).jqGrid("getGridParam", "selrow") is null then no row is selected. The call $(this).jqGrid("getGridParam", "selarrrow") get the value of another internal parameter "selarrrow" which is array of selected ids. If will be filled in case of usage multiselect:true.
So I think that you can display warning to the user if selrow is null or if selarrrow is empty array. If the need to redirect to another HTML page you can assign new value to location.href.

Answer 2

Use this in last line to uncheck last selected check box
jQuery(this).attr('checked', false);
Full code
jQuery(document).ready(function(){
jQuery('input:checkbox').change(
function(){
if (jQuery('input:checkbox:checked').length == jQuery('input:checkbox').length){
alert('Alert Text.');
jQuery(this).attr('checked', false);
}
});
});