Getting a specific array field length in php - javascript

I Want to get a specific field length from a Multidimensional Array but I don't know how and all I could find was sizeof(array) or count(array,count_recursive)
in javascript we can do this like :
var modalInfo = {
name : 'imagePreviewModal',
title : 'show picture',
wh : [500, 400],
tabs : [['imagePreviewTab', body]],
buttons : [],
cancelButton : false
};
window.alert(modalInfo.tabs.length);
body in : tabs : [['imagePreviewTab',body]], is and array.
what i need is the last line, i can get the length of modalInfo array field tabs.
how can I do the same in php?

This should work for you:
$count = count($modalInfo->tabs);

Related

How to get the value of a dojo FilteringSelect?

I'm using the dojo filteringSlect as followed:
new dijit.form.FilteringSelect({
name : "category",
title : "Category:",
placeHolder : "Select a category",
store : new Memory({data : [],idProperty : "name"}),
maxHeight : "250",
intermediateChanges : true,
searchAttr : "name",
onChange : lang.hitch(this, this._submitCategory)
});
I'm creating the memory store adding the values with ID's such as
id=1, value=abc and so on.
Assigning this memory store to store attribute of filteringSelect. I have added this widget to a form and calling form.watch to get the OnChange values.
this._formContentForASAP = new Form({
id : 'asap24x',
name : "ASAP 24x",
style : "height:30px;width:250px;"
});
this._formContentForASAP.resize();
this._formContentForASAP.placeAt(this._asapcontentpane);
this._formContentForASAP.watch('value', lang.hitch(this, this._handleASAPFormChanges));
With this I'm able to get only the ID after onChange.
_handleASAPFormChanges : function(prop, oldval, newval) {
// OnChange im able to get only the Id's
}
How do I get the values instead?
If you want the text inside the input field use this :-
dijit.registry.byId(ElementID).textbox.value;
If you want the value corresponding to selected option use this :-
dijit.registry.byId(ElementID).value;
where ElementID is the id provided to FilteringSelect element.

Jquery:autocomplete values and categories.Error: this.source is not a function

Here is the part of my Javascript:
$(function(){
var dbTags=<?php echo json_encode($namesArray);?>;
var myTag;
$("#searchTags").autocomplete({
source: dbTags,
minLength: 2,
select: function(event, ui){
myTag=ui.item.value;
My php code:
$findNames=$user_home->runQuery("SELECT productTitle, category from Iranga ");
$findNames->execute();
$information=$findNames->fetchAll(PDO::FETCH_ASSOC);
foreach($information as $item){
$namesArray=array("label:"=>$item['productTitle'], "category:"=>$item['category']);
}
Am planning to use this script:
https://jqueryui.com/autocomplete/#categories
The question how to use and define my dbTags variable, when it contains product tilte and categories?
If you're following the example you linked you want your "source" array to be an array of objects with "label" and "category" properties. I'm not sure what your PHP output is, or what database api you're using (assuming PDO), but I would try:
$findNames=$user_home->runQuery("SELECT productTitle, category from Products");
$findNames->execute();
while ($row=$findNames->fetch()){
$namesArray[] = array("label" => $row['productTitle'], "category" => $row['category']);
}

changing data of select2 with x-editable without re-setting source option

How to keep the source of option values updated in x-editable
without re-initialising the editable element with source.
Here is the sandbox : http://jsfiddle.net/wQysh/322/
HTML
<p>X-editable (dev)</p>
<div>
<button id="controller">Add</button>
</div>
<div>
<button id="controller1">Remove</button>
</div>
<div>
<button id="controller2">Update</button>
</div>
<div style="margin: 50px">
</div>
<div style="margin: 50px">
</div>
<div style="margin: 50px">
</div>
<div style="margin: 50px">
</div>
JS :
$.fn.editable.defaults.mode = 'inline';
var count = 4, sources = [];
for(var i = 1; i <= count; i++){
sources.push({ id : i, text : String(i) })
}
var getSource = function() {
//i want this function must be called whenever available options is rendred. to ensure i used JSON.parse
return JSON.parse(JSON.stringify(sources));
};
$('#controller2').click(function(e){
count++;
sources[2].text = String(count);
//to verify live changes, if a new record updated in sources and used instantly
$('#username').editable('setValue', [1, count]); $('#username2').editable('setValue', count);
});
$('#controller').click(function(e){
count++;
sources.push( {id : count, text :String(count) });
//to verify live changes, what if a new record added in sources and used instantly
$('#username').editable('setValue', [1, count]); $('#username2').editable('setValue', count);
});
$('#controller1').click(function(e){
count++;
var a = sources.pop();
//to verify live changes by selecting value that is not present in the list. It should escape those, print the rest all if available in list
$('#username').editable('setValue', [1, a.id]); $('#username2').editable('setValue', a.id);
});
$('#username').editable({ //to keep track of selected values in multi select
type: 'select2',
url: '/post',
autotext : 'always',
value : [1,2],
source : getSource,
emptytext: 'None',
select2: {
multiple : true
}
});
$('#username2').editable({ //to keep track of selected values in single select
type: 'select2',
url: '/post',
autotext : 'always',
value : 2,
source : getSource,
emptytext: 'None',
select2: {
multiple : false
}
});
$('#username3').editable({ //to keep track of available values in multi select
type: 'select2',
url: '/post',
autotext : 'always',
value : null,
source : getSource,
emptytext: 'None',
select2: {
multiple : true
}
});
$('#username4').editable({ //to keep track of available values in single select
type: 'select2',
url: '/post',
autotext : 'always',
value : null,
source : getSource,
emptytext: 'None',
select2: {
multiple : false
}
});
//ajax emulation. Type "err" to see error message
$.mockjax({
url: '/post',
responseTime: 400,
response: function(settings) {
if(settings.data.value == 'err') {
this.status = 500;
this.responseText = 'Validation error!';
} else {
this.responseText = '';
}
}
});
Requirement :
Whenever i add new item in sources, if item is not selected then it should be updated in available options otherwise if selected then view should have updated value at element.
Whenever i update an item in sources, if item is not selected then it should be updated in available options otherwise if selected then view should have updated value at element.
Whenever i delete an item in sources, if item is not selected then it should be removed from the available options otherwise if selected then view should have "None" value (if single select) and rest element values (if multi select) at element.
Not allowed:
to reinit the widget
to reinit the source option
I hope this is possible. But struggling to get the result.
EDIT2 : code did not worked when i used JSON.parse over stringified 'sources' Problem is still unresolved. New fiddle : http://jsfiddle.net/wQysh/322/
(EDIT1 was misleading this question so removed EDIT1)
EDIT3 : so far i am able to achieve this http://jsfiddle.net/wQysh/324/
Here problem is that previous selected values are not rendered, so can't remove the items if selected previously in multi-select
EDIT4: not completely solved, http://jsfiddle.net/wQysh/339/. After add or update the available option does change but after setting that new record, does not reflect in html element after submit.
the answer is to use a custom display function
here is the updated fiddle. http://jsfiddle.net/wQysh/357/
Every time we 'setValue' to editable or on close event editable's 'display' function is called.
in display function existing values is checked by this function
$.fn.editableutils.itemsByValue
where the third parameter accepts the idKey. If we do not provide third parameter while calling this function, it by default takes 'value' as idKey. and 'value' as idKey should not be used when we are using to load array data. ref : http://ivaynberg.github.io/select2/#data_array.
I added display function in which third parameter is 'id'.
and i got the desired result

How to add a new row in a group in jqGrid?

I am totally new to jqGrid. I am populating the grid from an array with datatype:local.
var data=[
{date : "01/01/2012",starttime:"10:15",endtime:"11:15",workfunction:"MA"},
{date : "01/02/2012",starttime:"11:30",endtime:"12:30",workfunction:"CA"},
{date : "01/03/2012",starttime:"13:30",endtime:"14:30",workfunction:"FC"},
{date : "01/01/2012",starttime:"10:15",endtime:"11:15",workfunction:"MA"},
{date : "01/01/2012",starttime:"11:30",endtime:"12:30",workfunction:"CA"},
{date : "01/02/2012",starttime:"13:30",endtime:"14:30",workfunction:"FC"},
{date : "01/02/2012",starttime:"10:15",endtime:"11:15",workfunction:"MA"},
{date : "01/03/2012",starttime:"11:30",endtime:"12:30",workfunction:"CA"},
{date : "01/03/2012",starttime:"13:30",endtime:"14:30",workfunction:"FC"}
];
$("#gridTable").jqGrid({
data : data,
editurl:"clientArray",
datatype: "local",
height : 250,
colNames: [' ','Date','Start Time','End Time','Work Function'],
colModel : [
{name: 'myac', width:80, fixed:true, sortable:false, resize:false, formatter:'actions',formatoptions:{keys:true}},
{name: 'date',index:'date',width: 100,sorttype:'date',editable:true,editoptions : {
dataInit : function(element){
formatDatepicker(element,data);
}
}},
{name: 'starttime',index:'starttime',width: 100,sorttype:'date',editable:true},
{name: 'endtime',index:'endtime',width: 100,sorttype:'date',editable:true},
{name: 'workfunction',index:'workfunction',width: 100,sorttype:'date',editable:true,edittype:"select",editoptions:{value:"MA:MA;CA:CA;FC:FC"}},
],
pager: "#gridPager",
caption : "Weekly Details",
grouping : true,
groupingView : {
groupField:['date']
}
}).navGrid("#gridPager",{edit:true,add:true,del:false},
//edit properties
{
zIndex : 950,
}
);
Given above is the grid I am using. I am grouping the grid according to dates, and I am using jsp as the server side technology. My questions are:
Can we add a row to a group without submitting it to the server.
When a new row is created with a new date, will a new group form.
Can we edit multiple rows and submit all at once.
let me be sure if i understood you right...1. you want to add a row to grid but dont want to submit the data to server? it is possible...2. you have to be more clear on this requirement. 3. yes it is possible to take all the edit data of multiple rows and send the data to server.
I'll start with 3.
you can use multiselect: true here, its like the easiest option. Select the rows which you want to edit and Implement onSelectRow with a function which will make your rows editable on selecting them.
and then you can have a button which will take your edited rows data to server.
how to make rows editable on selecting them
onSelectRow: function(id){
jQuery('#grid').editRow(id, true); }
or there's another alternative keep your all rows in editable mode
gridComplete:OnGridComplete, //add this to your Jqgrid parameters
javascript function
function OnGridComplete(){
var $this = $(this), rows = this.rows, l = rows.length, i, row;
for (i = 0; i < l; i++) {
row = rows[i];
if ($.inArray('jqgrow', row.className.split(' ')) >= 0) {
$this.jqGrid('editRow', row.id, true);
}
}
}
and how to take edited data to server just on one click, see my answer
https://stackoverflow.com/a/11662959/1374763
and now with you first question
you should change the editUrl to clientarray,
jQuery("#grid_id").jqGrid('saveRow',"rowid", false, 'clientArray');
check this link and go to saveRow parametrs, for more info
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:inline_editing

Javascript Error,Escaping Problem,Grid not working,Error on Firebug

we are just started with Sigma Grid ,and it is awesome in its functionality when we compared to other Grids.
But i encountered some problem with Sigma Grid ,or may be with javascript.
I dont know whether the problem is with Grid or with my code.
I have a table with 3 fields namely MailID,MailName,MailData.
MailID is int ,MailName and MailData contains HTML content and it save as string in database.
When i load the Grid,i have some problems.
Problem 1 :
As i said above the Maildata contain html content,the following image is just a example with <*b> ,u can see that the HTML is automatically rendering on the grid itself ,i need the exact string.
please check the following image.
Problem 2 :
as u can see i have links on the grid,for edit,send,delete but on one filed its damaged.[check the image below ]
the code i used to render links is following .
{id: 'mailid' , header: "Action", width :120 , resizable : false, sortable : false , printable : false ,
renderer : function(value ,record,columnObj,grid,colNo,rowNo){
var no= record[columnObj.fieldIndex];
var cod = (record['maildata']);
return 'Edit | Delete';
Problem 3 :
The third value of MailData is 5 and it is integer ,when i alert the value its shows it correctly.
check the following image.
But when i alert the second value of maildata it giving error ,the second value of MailData is "hai newuser" ,it showing the following error on firebug.
missing ) after argument list
alert(hai newuser)
check the image below.
But when i alert 9th value of MailData it run correctly ,the content is <b>poy</b> ,this one is also save as string,but the grid automatically BOLD [which i dnt like].Check the image below.
also there are some others the 7the value contain ;".: etc ,also /b ,when i alert the data it showing the following error,
unexpected end of XML source
alert(<b>jjfdslkdjflsdnfsldfnf
dsOptions and ColOptions are following .
var dsOption= {
fields :[
{name : 'mailid' },
{name : 'mailname',type:"text" },
{name : 'maildata',type:"text" }
],
recordType : 'object',
}
function my_renderer(value ,record,columnObj,grid,colNo,rowNo)
{
var no= record[columnObj.fieldIndex];
return "<img src=\"./images/flag_" + no.toLowerCase() + ".gif\">";
}
function showalert(no)
{
$(document).ready(function()
{
$.post("http://localhost/power/index.php/power/give",{ name: no}, function(data)
{
//alert("Data Loaded: " + data);
$("#editor").show("fast");
$( '#txtar' ).ckeditor();
$('#txtar' ).val( data.maildata );
//$("#editor").html(data);
},"json"
);
});
}
var colsOption = [
{id: 'mailid' , header: "Mail ID" , width :60},
{id: 'mailname' , header: "Mail Name" , width :160 ,type:"text"},
{id: 'maildata' , header: "Mail Data" , width :190,type:"text" },
{header: "Group" , width :70,
editor : { type :"select" ,options : {'php':'php','asp':'asp'}
,defaultText : 'php' } },
{id: 'mailid' , header: "Action", width :120 , resizable : false, sortable : false , printable : false ,
renderer : function(value ,record,columnObj,grid,colNo,rowNo){
var no= record[columnObj.fieldIndex];
var cod = (record['maildata']);
return 'Edit | Delete';
} }
];
I am littlebit new in Javascript and Sigmagrid,i think that i am doing something worst with codes,pls help me to success.
Thank you.
Note : i posted the same Question on Sigma Grid Forum too,i think that it is not a problem.
Problem 2
The string cod contains a >
Problem 3
The string hai newuser needs to be contained in " or ' or it is considered a variable name
Basically you have to decide -- are you going to validate the html or not. If you don't validate the HTML then html errors in the data will show as errors on your page. You could also HTML escape the html so you will see the HTML codes -- this is probably the best plan.
Other sites use (like this one) use markdown -- this is easier to validate -- then they generate the actual HTML before display.
In addition you are having problems with the alert. Alert displays strings not HTML so you will see what you are seeing -- different results than expected depending on the HTML.
I would take a step back and ask yourself -- what is the type of the data, how am I going to display it. How am I going to validate that if it is HTML it is valid.
There are the problems you need to address -- your examples all stem from this problem.

Categories

Resources