jQWidgets Forums

Forum Replies Created

Viewing 11 posts - 1 through 11 (of 11 total)

Author

Posts

December 5, 2014 at 3:46 pm in reply to: windows with grid, error when add another div windows with grid, error when add another div #63848

tompasto

Participant

It seems to work.
Tx !

December 5, 2014 at 3:39 pm in reply to: windows with grid, error when add another div windows with grid, error when add another div #63847

tompasto

Participant

Ok i will try

November 14, 2014 at 3:06 pm in reply to: Bindingcomplete error even if it set on code Bindingcomplete error even if it set on code #62777

tompasto

Participant

Ok tx

August 19, 2014 at 12:46 pm in reply to: My input stop working My input stop working #58517

tompasto

Participant

Hello Dimitar,

I solve the problem by re-install jqxwidget files.
It’s not the first time some features stop working and are solve by re-install files.

I don’t know if it come from our server apache version.

TX.

April 10, 2014 at 5:14 pm in reply to: DropDown list depend on result DropDown list depend on result #52899

tompasto

Participant

Hello peter,

In the exemple you provide, your field are hard coding in a switch that depend of a choice.
var cities = new Array();
switch (country) {
case “Belgium”:
cities = [“Bruges”, “Brussels”, “Ghent”];
break;
case “France”:
cities = [“Bordeaux”, “Lille”, “Paris”];
break;
case “USA”:
cities = [“Los Angeles”, “Minneapolis”, “Washington”];
break;
};

My goal is to display a dropdowns from a database query result.
something like:

if result in row 1 column one is Canada search Canadian States and list them into dropdown in column 2.

Tx.

February 28, 2014 at 7:54 pm in reply to: Reset Dropdownlist Reset Dropdownlist #50327

tompasto

Participant

Thanks for your reply

February 28, 2014 at 5:56 pm in reply to: Reset Dropdownlist Reset Dropdownlist #50318

tompasto

Participant

Here it is. Here also a youtube link with a screenshot: https://www.youtube.com/watch?v=sgD_YgEIyqI


<?php 
 require '../data/menu.php';
 require_once '../Config.php';
 
 ?>
 <!DOCTYPE html>
 <html>
 <head>
 <title>Gestion des cliniques</title>
 <link rel='stylesheet' type='text/css' href='/SaludWeb/css/styles.css' />
 <link rel="stylesheet" href="/SaludWeb/jqwidgets/jqwidgets/styles/jqx.base.css" type="text/css"/>
 <link rel="stylesheet" href="/SaludWeb/jqwidgets/jqwidgets/styles/jqx.Salud.css" type="text/css"/>
 <script src='/SaludWeb/js/jquery-1.10.2.js'></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxdatetimeinput.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxcalendar.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/globalization/globalize.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxlistbox.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxdropdownlist.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxdata.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxinput.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxmenu.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxgrid.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxgrid.selection.js"></script> 
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxgrid.columnsresize.js"></script> 
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxgrid.filter.js"></script> 
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxgrid.sort.js"></script> 
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxgrid.pager.js"></script> 
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxgrid.grouping.js"></script>
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxgrid.edit.js"></script> 
<script type="text/javascript" src="/jqwidgets/jqwidgets/jqxwindow.js"></script>
 
 </head>
 
 <script type="text/javascript">
 $(document).ready(function () {

	 var WLcode =
     {
             datatype: "json",
             datafields: [
             { name: 'CODE'},
             { name: 'WLdescr'},
             ],
             url: '/data/query.php?query=showWLcodes',
             async: false
         	
     };
	  var dataAdapter = new $.jqx.dataAdapter(WLcode);

	  var Operator =
	     {
	             datatype: "json",
	             datafields: [
	             { name: 'clinic_id'},
	             { name: 'STAFF_CODE'},
	             { name: 'operator'},
	             ],
	             url: '/data/query.php?query=showoperator',
	             async: false
	         	
	     };
		  var OpeData = new $.jqx.dataAdapter(Operator);

	 var Patient =
	 	 {
			    datatype: "json",
		   	    datafields: [
					{ name: 'HOSPITAL_NO', type: 'string'},
					{ name: 'Patient', type: 'string'}
					

				],
				url: '/SaludWeb/data/query.php?query=showpatient'
		};

	 var WLstatus =
     {
             datatype: "json",
             datafields: [
			 { name: 'CODE'},
             { name: 'DESCRIPTION'}
             ],
             url: '/data/query.php?query=showWLstatus',
             async: false
         	
     };
	  var WLstatusAdapter = new $.jqx.dataAdapter(WLstatus);     
	  
	 $("#Hospitalno").jqxInput({source: function (queries, response) {
			var dataAdapter3 = new $.jqx.dataAdapter
			(Patient,
				
				{
					autoBind: true,
					formatData: function (data) {
						data.queries = queries;
						return data;
					},
					loadComplete: function (data) {
						if (data.length > 0) {
							response($.map(data, function (item) {
								return item.Patient;
							}));
						}
					}
				}
			);
		},
		 				 
		 				 placeHolder: "Entrer un nom en premier",displayMember:'Patient', valueMember:'HOSPITAL_NO', height: 25, width: 200, minLength: 1, items: 15, 
			 				renderer: function (itemValue, inputValue) {
			 			        var value = itemValue.split("-");
			 			        return value[0];
		 			  }

	 });
	 $("#Hospitalno").on('select', function (event) {
	     if (event.args) { 
	         var item = event.args.item;
	         if (item) { 
	        	 var value =  item.label.split("-");
	        	 $('#Nom').val(value[1]);
	        	 $('#SetHospitalNo').val(value[0]);
	        	 ShowGrid();
	        	 var data='query=FilterArchive&Hospital_NO='+value[0] ;
	        	 $.ajax({
	                    dataType: 'json',
	                    url: '/SaludWeb/data/query.php',
	                    data: data,
	                    success: function (data, status, xhr) {
	         				if (data!=null){
	                    	$('#SetArchive').val('1');
	                    	
	                    	$("#Archive").html('<B><SPAN style="font-familly:Arial; font-size:15px; color:#F13338;"> DOSSIER ARCHIV&Eacute; MODIFICATION IMPOSSIBLE </SPAN>');
	                    	$("#ResultGrid").jqxGrid({editable: false});
                    		}
	         				else{
	         						$("#Archive").html('');
		         					$('#SetArchive').val('0');
		         				}
		                    }}) 
	         }
	     }
	 }); 
	 
	 $("#Nom").jqxInput({source: function (queries, response) {
			var dataAdapter3 = new $.jqx.dataAdapter
			(Patient,
				
				{
					autoBind: true,
					formatData: function (data) {
						data.queries = queries;
						return data;
					},
					loadComplete: function (data) {
						if (data.length > 0) {
							response($.map(data, function (item) {
								return item.Patient;
							}));
						}
					}
				}
			);
		},
		 				 
		 				 placeHolder: "Entrer un nom en premier",displayMember:'Patient', valueMember:'HOSPITAL_NO', height: 25, width: 200, minLength: 1, items: 15, 
			 				renderer: function (itemValue, inputValue) {
			 			        var value = itemValue.split("-");
			 			        return value[1];
		 			  }

	 });
	 
	 $("#Nom").on('select', function (event) {
	     if (event.args) { 
	         var item = event.args.item;
	         if (item) { 
	        	 var value =  item.label.split("-");
	        	 $('#Hospitalno').val(value[0]);
	        	 $('#SetHospitalNo').val(value[0]);
	        	 ShowGrid();
	        	 var data='query=FilterArchive&Hospital_NO='+value[0] ;
	        	 $.ajax({
	                    dataType: 'json',
	                    url: '/SaludWeb/data/query.php',
	                    data: data,
	                    success: function (data, status, xhr) {
	         				if (data!=null){
	                    	$('#SetArchive').val('1');
	                    	$("#Archive").html('<B><SPAN style="font-familly:Arial; font-size:15px; color:#F13338;"> DOSSIER ARCHIV&Eacute; MODIFICATION IMPOSSIBLE </SPAN>');
	                    	$("#ResultGrid").jqxGrid({editable: false});
                    	    }
	         				else{
	         						$("#Archive").html('');
		         					$('#SetArchive').val('0');
		         				}
		                    }})
	        	
	         }
	     }
	 });
	 
     $("#WLcode").jqxDropDownList({ source: dataAdapter, selectedIndex: -1,  height: '25px', width:'250px', theme: 'Salud', displayMember:'WLdescr', valueMember:'CODE'  });
     $("#WLcode").on('change', function (event) {
         var Codeliste=event.args.item.value;
         $('#SetCodeList').val(Codeliste); 
         ShowGrid();
     });
         
     
      
	 $("#WLstatus").jqxDropDownList({ source: WLstatusAdapter , selectedIndex: -1, width: '200px', height: '20px', theme: 'Salud', displayMember:'DESCRIPTION', valueMember:'CODE' });
	 $("#WLstatus").on('change', function (event) {
         var Codeliste=event.args.item.value;
         $('#SetListStatus').val(Codeliste); 
         ShowGrid();
     })
     
     $("#DateRappel").jqxDateTimeInput({ formatString: 'yyyy-MM-dd', value: null,width: '150px', height: '25px', theme: 'Salud',allowNullDate: true });
     $("#Operator").jqxInput({source: OpeData, placeHolder: "Entrer un etudiant", displayMember:"operator",valueMember:"STAFF_CODE", height: 25, width: 200, minLength: 1 });
     $("#Operator").on('select', function (event) {
	     if (event.args) { 
	         var Operatorvalue = event.args.item.value;       
	        	 $('#SetOperateur').val(Operatorvalue);
	        	 ShowGrid();	         
	     }
	 }); 
	 
     $("#Operateur").jqxInput({source: OpeData, placeHolder: "Entrer un etudiant", displayMember:"operator",valueMember: "clinic_id", height: 25, width: 200, minLength: 1, theme:'Salud'});		
     $("#popupWindow").jqxWindow({
         width: 500, resizable: false,  isModal: true, autoOpen: false, cancelButton: $("#Cancel"), modalOpacity: 0.01           
     });
     $("#popupWindow").on('open', function () {
         $("#Operateur").jqxInput('selectAll');
     });

     $("#Cancel").jqxButton({ theme: 'Salud' });
     $("#Save").jqxButton({ theme: 'Salud' });

     $("#Save").click(function () {
         if (editrow >= 0) {
             var row = { firstname: $("#Operateur").val()};
             var rowID = $('#ResultGrid').jqxGrid('getrowid', editrow);
             $('#ResultGrid').jqxGrid('updaterow', rowID, row);
             $('#Updatecolumn').val('OPERATOR');
             $('#UpdateValue').val()=$("#Operateur").val();
             $("#popupWindow").jqxWindow('hide');
         }
     });

 });

 function erase()
 {

	 $("#WLstatus").jqxDropDownList({ selectedIndex: -1});
	 $("#WLcode").jqxDropDownList({ selectedIndex: -1});
	 $('#Hospitalno').val('');
	 $('#Nom').val('');
	 $('#Operator').val('');
	 $('#DateRappel').val(null);
	 $('#SetHospitalNo').val('1');
	 $('#SetCodeList').val('');
	 $('#SetListStatus').val('');
	 $('#SetOperateur').val('');
	 $('#Setpriority').val('');
	 $('#SetRecallDate').val('');
	 ShowGrid();
	
 }

 function ShowGrid()
 {
	
	 var HospitalNo=$('#SetHospitalNo').val();
	 var CodeListe=$('#SetCodeList').val();
	 var ListeStatus=$('#SetListStatus').val();
	 var STAFF_CODE=$('#SetOperateur').val();
	 var Archive=$('#SetArchive').val();
	 
	 var WLentries =
 	 {
		    datatype: "json",
	   	    datafields: 
		[
		{ name: 'WL_NUMBER', type: 'string'},
		{ name: 'NOM', type: 'string'},
		{ name: 'LISTE', type: 'string'},
		{ name: 'WL_CODE', type: 'string'},
		{ name: 'WL_STATUS', type: 'string'},
		{ name: 'HOSPITAL_NO', type: 'string'},
		{ name: 'ENTRY_DATE', type: 'date', format: 'dd/MM/yyyy'},
		{ name: 'PRIORITY', type: 'string'},
		{ name: 'REFERRAL_NO', type: 'string'},
		{ name: 'APPOINTMENT_MADE', type: 'string'},
		{ name: 'APPOINTMENT_LINK', type: 'string'},
		{ name: 'OPERATOR', type: 'string'},
		{ name: 'APPOINTMENT_REASON', type: 'string'},
		{ name: 'APPOINTMENT_FOR', type: 'string'},
		{ name: 'WL_NOTES', type: 'string'},
		{ name: 'RECALL_DATE', type: 'date'},
		{ name: 'EPISODE_NO', type: 'string'},
		{ name: 'STATUS_CHANGED_DATE', type: 'date', format: 'dd/MM/yyyy'},
		{ name: 'OPERATOR_TYPE2', type: 'string'},
		{ name: 'LOCATION', type: 'string'},
		{ name: 'SHORT_NOTICE', type: 'string'},
		{ name: 'INSERTED_DATE', type: 'date', format: 'dd/MM/yyyy'},
		{ name: 'INSERTED_BY', type: 'string'},
		],
			id: 'WL_NUMBER',
			url: '/data/query.php?query=showWLentries&HOSPITALNO='+HospitalNo+'&CodeListe='+CodeListe+'&ListeStatus='+ListeStatus+'&STAFF_CODE='+STAFF_CODE,
			
			updaterow: function (rowid, rowdata, commit) {

			
				var cellname=$('#Updatecolumn').val();
				var cellValue=$('#UpdateValue').val();
				
				$('#Updatecolumn').val('');
				$('#UpdateValue').val('');
				
                var data = "query=updateWL&cellname=" + cellname +"&cellValue=" +cellValue ;
                data = data + "&id=" +rowid;
                $.ajax({
                    dataType: 'json',
                    url: '/data/SqlDataModification.php',
                    data: data,
                    success: function (data, status, xhr) {
                       
                        commit(true);
                    }})
			}
	};
	 var WLData = new $.jqx.dataAdapter(WLentries);

	 var WLstatus =
     {
             datatype: "json",
             datafields: [
			 { name: 'CODE'},
             { name: 'DESCRIPTION'}
             ],
             url: '/SaludWeb/data/query.php?query=showWLstatus',
             async: false
         	
     };
	  var WLstatusdata = new $.jqx.dataAdapter(WLstatus);

	  var WLcode =
	     {
	             datatype: "json",
	             datafields: [
	             { name: 'CODE'},
	             { name: 'WLdescr'},
	             ],
	             url: '/SaludWeb/data/query.php?query=showWLcodes',
	             async: false
	         	
	     };
		  var WLcodedata = new $.jqx.dataAdapter(WLcode);

          
  $("#ResultGrid").jqxGrid(
	 {
		 source: WLData,
		 width: 1580,
		 columns: [
					{ text: 'NO_DOSSIER', editable: false, datafield: 'HOSPITAL_NO', width: 80 },
					{ text: 'NOM', editable: false, datafield: 'NOM', width: 150 },
					{ text: 'LISTE', columntype: 'dropdownlist', datafield: 'LISTE', width: 200
  						, createeditor: function (row, cellvalue, editor) {
       					  editor.jqxDropDownList({ source: WLcodedata, displayMember:"WLdescr",placeHolder: ""});  }
  						, cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
    							if (newvalue == "") return oldvalue;
    							$('#Updatecolumn').val(column);
    							$('#UpdateValue').val(newvalue);
   
    
    					  }
        
					},
	
					{ text: 'STATUT', columntype: 'dropdownlist', datafield: 'WL_STATUS', width: 140
    					, createeditor: function (row, cellvalue, editor) {
       						 editor.jqxDropDownList({ source: WLstatusdata, displayMember:"DESCRIPTION"});
   						 }
						, cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
    						if (newvalue == "") return oldvalue;
   							 $('#Updatecolumn').val(column);
    						 $('#UpdateValue').val(newvalue);
   						  }
					},
					{ text: 'PRIOR', datafield: 'PRIORITY', width: 50 },
					{ text: 'OPERATOR', datafield: 'OPERATOR', width: 200 },
					{ text: '', datafield: 'Edit', columntype: 'button',  cellsrenderer: function () {
   							 return "...";
 							 }, buttonclick: function (row) {
									 $('#ResultGrid').jqxGrid('focus');
    								 editrow = row;
    								 var offset = $("#ResultGrid").offset();
    								 $("#popupWindow").jqxWindow({ position: { x: parseInt(offset.left) + 200, y: parseInt(offset.top) + 60 } });
   
    								 var dataRecord = $("#ResultGrid").jqxGrid('getrowdata', editrow);
    								  $("#Operateur").val(dataRecord.OPERATOR);
    								  $("#popupWindow").jqxWindow('open');
								 }
					},
					{ text: 'DATE RAPPEL', datafield: 'RECALL_DATE', columntype: 'datetimeinput', width: 110, align: 'right', cellsalign: 'right', cellsformat: 'dd-MM-yyyy'	
					},

					{ text: 'NOTES', datafield: 'WL_NOTES', width: 300 },
					{ text: 'CHANG STATUT', editable: false,  datafield: 'STATUS_CHANGED_DATE', width: 100,cellsformat: 'dd-MM-yyyy' },
					{ text: 'INSER LE', editable: false, datafield: 'INSERTED_DATE', width: 100, cellsformat: 'dd-MM-yyyy' },
					{ text: 'INSER PAR', editable: false, datafield: 'INSERTED_BY', width: 100 },

		       ],
		      
		     theme: 'Salud',
		     sortable: true,
		     pageable: true,
             autoheight: true,
             columnsresize: true,
             editable: true
		             
	 });		  

 }

 </script>
 
 <BODY>
 <FORM action="">

 <BR>
  <div class="shadow-box">
    <br>
 	<div id='Archive'></div>	
  	<table style="font-familly:Arial;" >
  		<tr><td><B>FILTRES:</td><td></td><td></td><td></td>
  		<td><a href="#" class="bubble" onclick="erase()"><img alt="effacer" src="/SaludWeb/images/erase1.png" width="30" height="30"><span>Effacer</span></a></td>
  		</tr>
  		<tr>
  		 <TD>
  		  No. Dossier:
  		 </TD>
  		 <td><input type="text" id='Hospitalno'> </td>
  		 <TD>
  		  Nom:
  		 </TD>
  		 <td><input id='Nom'/> </td>
  		 
  		</tr><tr>
  		 <TD>
  		  Code Liste:
  		 </TD>
  		 <td><div id='WLcode'></div></td>
  		 <TD>
  		  
  		 </TD>
  		 <td></td>
  		</tr><tr>
  		 <TD>
  		  Statut Liste:
  		 </TD>
  		 <td><div id='WLstatus'></div></td>
  		 <TD>
  		  Op&eacute;rateur:
  		 </TD>
  		 <td><input id='Operator' /> </td>
  		</tr><tr>
  		 <TD>
  		  Prioritaire
  		 </TD>
  		 <td><input type='checkbox' id='Priority'></td>
  		</tr><tr>
  		  <TD>
  		  Chercher par date de rappel
  		 </TD>
  		 <td><div id='DateRappel'></div></td>
  		 <TD>
  		 </TD>
  		 <td></td>
  		 
  		</tr>
  	</table>
  </div>
  <br>
  <div class="shadow-box">
  <div id="ResultGrid"></div>

  </div>
    <div style="margin-top: 30px;">
            <div id="cellbegineditevent"></div>
            <div style="margin-top: 10px;" id="cellendeditevent"></div>
 </div>
       <div id="popupWindow">
            <div>Edit</div>
            <div style="overflow: hidden;">
                <table>
                    <tr>
                        <td align="right">Operateur:</td>
                        <td align="left"><input id="Operateur" /></td>
                    </tr>

                    <tr>
                        <td align="right"></td>
                        <td style="padding-top: 10px;" align="right"><input style="margin-right: 5px;" type="button" id="Save" value="Save" /><input id="Cancel" type="button" value="Cancel" /></td>
                    </tr>
                </table>
            </div>
       </div>
       <input type='hidden' id='Updatecolumn' />
       <input type='hidden' id='UpdateValue' />
       <input type='hidden' id='SetHospitalNo' />
       <input type='hidden' id='SetCodeList' />
       <input type='hidden' id='SetListStatus' />
       <input type='hidden' id='SetOperateur' />
       <input type='hidden' id='Setpriority' />
       <input type='hidden' id='SetRecallDate' />
       <input type='hidden' id='SetArchive' />
   </FORM>
 </BODY>

February 27, 2014 at 2:33 pm in reply to: Update Value in grid Update Value in grid #50240

tompasto

Participant

Tx Dimitar,

Can you tell me so, what the grid call ‘updaterow’ is use for ^
Tx.

February 24, 2014 at 4:47 pm in reply to: dropdown weird behavior dropdown weird behavior #50014

tompasto

Participant

It works, Thanks !

November 21, 2013 at 7:08 pm in reply to: Unwanted space on jqxdropdownlist value Unwanted space on jqxdropdownlist value #33094

tompasto

Participant

sorry i see space on the input value in the debugger

November 21, 2013 at 7:06 pm in reply to: Unwanted space on jqxdropdownlist value Unwanted space on jqxdropdownlist value #33092

tompasto

Participant

hello,
I get the value with $(“#session”).jqxDropDownList(‘getItems’).value
Also on inspecting element with google chrome debugger i see:
”

Author

Posts

Viewing 11 posts - 1 through 11 (of 11 total)