We Keep Coding

Update for progress bar of a loop with post method

I have a loop from an array and what it does is before saving it in datatable it will check if the item exsist in database and here is the code
for (i = 0, len = array.length; i < len; i++) {
var item_code = array[i][1];
var description = array[i][2];
var qty = array[i][0];
if (item_code != "") {
console.log(item_code);
var if_exsist = function () {
var tmp = null;
$.ajax({
url: "../program_assets/php/web/stocks_excel_insert_transactions.php",
data: {
saving_mode : 'check_item',
item_code : item_code
},
'async': false,
type: 'post',
success: function (data) {
var data = data.trim();
if (data == 0) {
tmp = "no"
$('#btn_save').prop('disabled', true);
} else {
tmp = "yes"
}
}
});
return tmp;
}();
tbl_delivery_list.row.add({
"docket_number" : docket_number,
"from" : from,
"from_id" : from_id,
"to" : to,
"to_id" : to_id,
"item_code" : item_code,
"description" : description,
"qty" : comma(qty),
"exsist" : if_exsist
}).draw( false );
counter++;
}
}
the code above will work but my problem is how can I incorporate a progress bar? loading sample. I add this code but the loading happens after all the work has been done.
progress = counter / array.length;
progress = progress * 100;
$(".bar").css("width", progress + "%");
my target here is to update the progress bar one by one after doing the code on the 1st one

Create view as popup in Titanium

I'm trying to create a popup like this
A user presses a button and a selection of options appear, which I call a popup.
In the meantime the background goes black transparant.
I've spend the last few hours online trying to find a good example of how to achieve this, but without luck.
Oh yeah, I would like to use alloy to define the popup.
Thanks in advance for your help!

hey #falcko this is an example of how to create popup window
hope this help
logout_view.addEventListener("click",function(){
var t = Titanium.UI.create2DMatrix();
t = t.scale(0);
var w = Titanium.UI.createWindow({
height:Ti.UI.FILL,
width:Ti.UI.FILL,
transform:t,
backgroundColor:"transparent",
// opacity:0.5
});
var v = Titanium.UI.createView({
backgroundColor:'white',
// height:"240dp",
//width:"293dp",
height:Ti.UI.FILL,
width:Ti.UI.FILL,
backgroundColor:"black",
opacity:0.7
});
var popup=Ti.UI.createView({
height:"240dp",
width:"293dp",
backgroundColor:"white",
});
var plz=Ti.UI.createLabel({
text:"Please specify the reason for reporting",
top:"21dp",
width:Ti.UI.FILL,
textAlign:"center",
font : {
fontFamily : customfont,
fontSize : "16dp"
},
color:"#454545",
});
var check1=Ti.UI.createView({
width:Ti.UI.SIZE,
height:Ti.UI.SIZE,
left:"16dp",
top:"55dp"
});
var checkbox1=Ti.UI.createView({
width:"8dp",
height:"8dp",
borderRadius:"4dp",
borderColor:"#CBCBCB",
borderWidth:"0.5dp",
left:"0dpdp",
selected:1
});
var serious=Ti.UI.createLabel({
left:"20dp",
text:"User wasn't serious",
font : {
fontFamily : customfont2,
fontSize : "15dp"
},
//top:"53dp",
color:"#666666"
});
check1.add(serious);
check1.add(checkbox1);
popup.add(check1);
var check2=Ti.UI.createView({
width:Ti.UI.SIZE,
height:Ti.UI.SIZE,
left:"16dp",
top:"79dp"
});
var checkbox2=Ti.UI.createView({
width:"8dp",
height:"8dp",
borderRadius:"4dp",
borderColor:"#CBCBCB",
borderWidth:"0.5dp",
left:"0dp",
selected:0
});
var rude=Ti.UI.createLabel({
left:"20dp",
text:"User was rude and abusive",
font : {
fontFamily : customfont2,
fontSize : "15dp"
},
//top:"76dp",
color:"#666666"
});
check2.add(rude);
check2.add(checkbox2);
popup.add(check2);
var checkbox3=Ti.UI.createView({
width:"8dp",
height:"8dp",
borderRadius:"4dp",
borderColor:"#CBCBCB",
borderWidth:"0.5dp",
left:"16dp",
top:"102dp",
selected:0
});
var foul=Ti.UI.createLabel({
left:"36dp",
text:"User used foul language",
font : {
fontFamily : customfont2,
fontSize : "15dp"
},
top:"100dp",
color:"#666666"
});
popup.add(foul);
popup.add(checkbox3);
var checkbox4=Ti.UI.createView({
width:"8dp",
height:"8dp",
borderRadius:"4dp",
borderColor:"#CBCBCB",
left:"16dp",
borderWidth:"0.5dp",
top:"126dp",
selected:0
});
var other=Ti.UI.createLabel({
left:"36dp",
text:"Other",
font : {
fontFamily : customfont2,
fontSize : "15dp"
},
top:"123dp",
color:"#666666"
});
popup.add(other);
popup.add(checkbox4);
checkbox1.addEventListener("click",function(){
if(checkbox1.selected==0){
checkbox1.setBackgroundColor(o_color);
checkbox1.selected=1;
checkbox2.setBackgroundColor("white");
checkbox2.selected=0;
checkbox3.setBackgroundColor("white");
checkbox3.selected=0;
checkbox4.setBackgroundColor("white");
checkbox4.selected=0;
}
});
checkbox2.addEventListener("click",function(){
if(checkbox2.selected==0){
checkbox1.setBackgroundColor("white");
checkbox1.selected=0;
checkbox2.setBackgroundColor(o_color);
checkbox2.selected=1;
checkbox3.setBackgroundColor("white");
checkbox3.selected=0;
checkbox4.setBackgroundColor("white");
checkbox4.selected=0;
}
});
checkbox3.addEventListener("click",function(){
if(checkbox3.selected==0){
checkbox1.setBackgroundColor("white");
checkbox1.selected=0;
checkbox3.setBackgroundColor(o_color);
checkbox3.selected=1;
checkbox2.setBackgroundColor("white");
checkbox2.selected=0;
checkbox4.setBackgroundColor("white");
checkbox4.selected=0;
}
});
checkbox4.addEventListener("click",function(){
if(checkbox4.selected==0){
checkbox1.setBackgroundColor("white");
checkbox1.selected=0;
checkbox4.setBackgroundColor(o_color);
checkbox4.selected=1;
checkbox2.setBackgroundColor("white");
checkbox2.selected=0;
checkbox3.setBackgroundColor("white");
checkbox3.selected=0;
}
});
popup.add(plz);
var other_view=Ti.UI.createView({
top:"154dp",
left:"15dp",
right:"15dp",
height:"30dp",
borderWidth:1,
borderColor:"#C9C9C9"
});
var send=Ti.UI.createButton({
title:"Send",
height:"33dp",
top:"197dp",
color:"white",
width:"102dp",
backgroundColor:o_color,
font : {
fontFamily : customfont,
fontSize : "13dp"
},
});
popup.add(send);
popup.add(other_view);
// create first transform to go beyond normal size
var t1 = Titanium.UI.create2DMatrix();
t1 = t1.scale(1.1);
var a = Titanium.UI.createAnimation();
a.transform = t1;
a.duration = 200;
// when this animation completes, scale to normal size
a.addEventListener('complete', function()
{
Titanium.API.info('here in complete');
var t2 = Titanium.UI.create2DMatrix();
t2 = t2.scale(1.0);
w.animate({transform:t2, duration:200});
});
v.addEventListener('click', function()
{
var t3 = Titanium.UI.create2DMatrix();
t3 = t3.scale(0);
w.close();
});
w.add(v);
w.add(popup);
w.open(a);
}
);

Titanium error in retrieving rows

getting error when retrieving the datas from the row using an id and displaying it in the textfield in next page..and another error is all the rows are getting deleted when passing id for a specific row..
Here is the coding:
var data = [];
var db = Titanium.Database.open('trip');
db.execute('CREATE TABLE IF NOT EXISTS newtrip (id INTEGER PRIMARY KEY AUTOINCREMENT, triplabel TEXT,tripname TEXT,destination TEXT,fromdate TEXT,todate TEXT)');
//db.execute('INSERT INTO newtrip(triplabel,tripname,destination,fromdate,todate) VALUES(?,?,?,?,?)',"British museum","mytrip","london","12-10-2014","12-12-2014");
//db.execute('DELETE FROM newtrip');
var resultrows = db.execute('SELECT destination,fromdate,todate FROM newtrip');
while (resultrows.isValidRow()) {
//var res=
var row = Ti.UI.createTableViewRow({
height : Ti.UI.SIZE,
rightImage : '/images/right1.png',
layout : 'absolute'
});
var tripnamelabel = Ti.UI.createLabel({
//text : 'Buckingham Palace',
text : resultrows.fieldByName('destination'),
color : theme_style,
font : {
fontSize : '16dp',
fontWeight : 'bold'
},
top : '10dp',
left : '10dp',
//right:'30dp'
});
var gettablecount = resultrows.rowCount;
for (var i = 0; i < gettablecount; i++) {
var data_edit = [];
var imgedit = Ti.UI.createButton({
backgroundImage : '/images/list_edit.png',
// left:'200dp',
top : '20dp',
width : wb,
height : hb,
// bottom:10,
right : '20dp',
onClick : "edit",
rowid : resultrows.fieldByName('id')
});
if (resultrows.isValidRow()) {
imgedit.addEventListener('click', function(e) {
var db = Titanium.Database.open('trip');
if (e.source.onClick == "edit") {
var x = db.execute('SELECT * FROM newtrip WHERE id=' + rowid);
//alert(x);
var createnewWindowback = require('ui/apppage5');
//the name of the url you wish to move
new createnewWindowback(e.source.rowid).open();
win.close();
}
resultrows.close();
db.close();
});
}
}
for (var i = 0; i < gettablecount; i++) {
var imgdelete = Ti.UI.createButton({
backgroundImage : '/images/delete_ic.png',
// left:'240dp',
top : '20dp',
width : wb,
height : hb,
//bottom:'20dp',
right : '60dp',
onClick : "delete",
rowid : resultrows.fieldByName('id')
});
imgdelete.addEventListener('click', function(e) {
var db = Titanium.Database.open('trip');
if (e.source.onClick == "delete") {
var x = db.execute('DELETE FROM newtrip WHERE id=' + rowid);
alert("you have just clicked the delete button");
}
resultrows.next();
db.close();
});
}
var fromdate = Ti.UI.createLabel({
//text : '10.11.2014',
text : resultrows.fieldByName('fromdate'),
color : 'Black',
font : {
fontSize : '13dp',
fontWeight : 'bold'
},
top : '40dp',
left : '10dp',
right : '10dp',
bottom : '20dp'
});
var dash = Ti.UI.createLabel({
text : '-',
color : 'Black',
font : {
fontSize : '15dp',
fontWeight : 'bold'
},
top : '40dp',
left : '80dp',
right : '10dp',
bottom : '20dp'
});
var todate = Ti.UI.createLabel({
text : resultrows.fieldByName('todate'),
color : 'Black',
font : {
fontSize : '13dp',
fontWeight : 'bold'
},
top : '40dp',
left : '90dp',
right : '10dp',
bottom : '20dp'
});
row.add(tripnamelabel);
row.add(imgedit);
row.add(imgdelete);
row.add(fromdate);
row.add(dash);
row.add(todate);
row.className = 'control';
data.push(row);
resultrows.next();
}
resultrows.close();
db.close();
triplistview.setData(data);

I think you not able to fetch data according to id field because you fetch the data in resultrows variable as :
var resultrows = db.execute('SELECT destination,fromdate,todate FROM newtrip');
So here you do not fetch the id column. But you use it at :
rowid : resultrows.fieldByName('id') // in : var imgedit
Hence rowid for var imgedit would be null/undefined. You should modify your SELECT query as :
var resultrows = db.execute('SELECT id,destination,fromdate,todate FROM newtrip');
Edit : Under click listener of imgedit you have :
var x = db.execute('SELECT * FROM newtrip WHERE id=' + rowid);
But there is no variable rowid defined, hence error is thrown. Make following changes ( rowid changed to e.source.rowid) :
var x = db.execute('SELECT * FROM newtrip WHERE id=' + e.source.rowid);
Hope it helps.

How can I place a button on each row in titanium studio?

I want to be able to put a different button inside every row (createTableViewRow). I have created five buttons (Titanium.UI.createButton), but I don't know how to place all five of my buttons for each created row.
Can somebody give me a hint on how to do it?
function sendAjax() {
var xhr = Titanium.Network.createHTTPClient();
xhr.onerror = function(e){
var error = e.error;
alert(error);
};
xhr.open('GET', 'http://xxxxxxxxxxxxxx');
xhr.send();
var tv = Titanium.UI.createTableView({
height: Titanium.UI.SIZE,
width: Titanium.UI.FILL
});
win2.add(tv);
xhr.onload = function() {
var data = [];
var schools = JSON.parse(this.responseText);
for (s in schools) {
data.push(Titanium.UI.createTableViewRow({
title: schools[s].Name
}));
}
tv.data = data;
};
}

You should add the listener event on the tableView, not on each buttons inside the row :
tableView.addEventListener("click", function (event) {
if (event.source.buttonid) {
//it's a button
}
});

Try this,
var win = Ti.UI.createWindow({
backgroundColor : '#fff'
});
var tableData = [];
for(var i = 0; i < 10; i++) {
var row = Ti.UI.createTableViewRow();
var button = Ti.UI.createButton({
title : 'Button ' + i,
width : 100,
height : 40,
buttonid : i //our custom button property
});
row.add(button);
tableData.push(row);
button.addEventListener('click', function(e) {
Ti.API.info('button ' + e.source.buttonid + ' clicked.');
alert('Button ' + e.source.buttonid);
});
}
var tableView = Ti.UI.createTableView({
data : tableData
});
win.add(tableView);
win.open();
This answer find from here
UPDATE :
function sendAjax() {
var xhr = Titanium.Network.createHTTPClient();
xhr.onerror = function(e){
var error = e.error;
alert(error);
};
xhr.open('GET', 'http://xxxxxxxxxxxxxx');
xhr.send();
var tv = Titanium.UI.createTableView({
height: Titanium.UI.SIZE,
width: Titanium.UI.FILL
});
win2.add(tv);
xhr.onload = function() {
var data = [];
var schools = JSON.parse(this.responseText);
for (s in schools) {
var row = Ti.UI.createTableViewRow();
var rowItem = Ti.UI.createView({
height : 40,
width : Ti.UI.FILL,
layout : 'horizontal'
});
row.add(rowItem);
var title = Ti.UI.createLabel({
height : 40,
text : schools[s].Name,
width : Ti.UI.SIZE
});
rowItem.add(title);
var button = Ti.UI.createButton({
title : 'click ',
width : 100,
height : 40,
buttonid : s //our custom button property
});
rowItem.add(button);
data.push(row);
button.addEventListener('click', function(e) {
Ti.API.info('button ' + JSON.stringify(e.source.buttonid) + ' clicked.');
});
};
tv.data = data;
};
};
Don't forget to mark this as correct answer If this useful.

Arrays variable - how to get the first var

It's seems to be very easy but i can not make it works. I have an array con 2 var inside that i get from Jquery.
var features = [long, lat ]
i would like to get all the valores in the loop and i need
fetures[i]
that will give me long1 and lat1 but when i try
alert( features[0] )
i get all the long values.
and when i try with [1] i get all the lat values.
How can i solve this issue?
I can not make it work, maybe you can have a look at my code:
$.ajax({
url : "https://api.foursquare.com/v2/venues/search?limit=3&radius=1000&client_id=J22NHX41TJBJ2PZM4NBTLDWLDYIBWLMIF4LJCFWNAXK1WALY&client_secret=RS110L4OYLY1XFCEMV30UB2JJ1JRFQZ0E3P0USSIMSCA45RZ&v=20120101&ll=" + ui.item.y +"," + ui.item.x,
dataType : "jsonp",
success : function(data) {
$.each(data.response.venues, function( index, value ) {
//alert( index + ": " + value.name + " , "+ value.location.lng);
var Name = value.name
var VenueLati = value.location.lat
var VenueLong = value.location.lng
//alert( VenueLong );
var features = [];
for(var i = 0; i < features[0].length; i++) {
feature[i] = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(VenueLong, VenueLati).transform('EPSG:4326', 'EPSG:3857'),
{some:'data'},
{
foo :
}, {
fillColor : '#008040',
fillOpacity : 0.8,
strokeColor : "#ee9900",
strokeOpacity : 1,
strokeWidth : 1,
pointRadius : 8
});
}
When i put a number intead features[0].length then i can see the points but can see only one popup :/
$.ajax({
url : "https://api.foursquare.com/v2/venues/search?limit=3&radius=1000&client_id=J22NHX41TJBJ2PZM4NBTLDWLDYIBWLMIF4LJCFWNAXK1WALY&client_secret=RS110L4OYLY1XFCEMV30UB2JJ1JRFQZ0E3P0USSIMSCA45RZ&v=20120101&ll=" + ui.item.y +"," + ui.item.x,
dataType : "jsonp",
success : function(data) {
$.each(data.response.venues, function( index, value ) {
//alert( index + ": " + value.name + " , "+ value.location.lng);
var Name = value.name
var VenueLati = value.location.lat
var VenueLong = value.location.lng
alert( VenueLong );
var features = [];
for(var i = 0; i<50; i++) {
features[i] = new OpenLayers.Feature.Vector(
toMercator(new OpenLayers.Geometry.Point(VenueLong,
VenueLati)),
{
ulica : Name
}, {
fillColor : '#008040',
fillOpacity : 0.8,
strokeColor : "#ee9900",
strokeOpacity : 1,
strokeWidth : 1,
pointRadius : 8
});
}
// create the layer with listeners to create and destroy popups
var vector = new OpenLayers.Layer.Vector("Points",{
eventListeners:{
'featureselected':function(evt){
var feature = evt.feature;
var popup = new OpenLayers.Popup.FramedCloud("popup",
OpenLayers.LonLat.fromString(feature.geometry.toShortString()),
null,
"<div style='font-size:.8em'>Name: " + feature.id +"<br>Address: " + feature.attributes.ulica+"</div>",
null,
true
);
feature.popup = popup;
map.addPopup(popup);
},
'featureunselected':function(evt){
var feature = evt.feature;
map.removePopup(feature.popup);
feature.popup.destroy();
feature.popup = null;
}
}
});
vector.addFeatures(features);
// create the select feature control
var selector = new OpenLayers.Control.SelectFeature(vector,{
hover:true,
autoActivate:true
});
map.addLayers([vector]);
map.addControl(selector);
center = new OpenLayers.LonLat(lon, lat).transform('EPSG:4326', 'EPSG:3857');
map.setCenter(center, 15);

You have 2 array in one array like this:
var features = [ [100, 200, 300, 400], ["A", "B", "C", "D"];
if you want to get the long s, you should do this:
for(var i=0;i<features[0].length;i++){
alert(features[0][i]);
}
and for the lat s:
for(var j=0;j<features[1].length;j++){
alert(features[1][j]);
}
but I think you are expecting something else, like an array of json objects with long and lat as its keys, although you can map these 2 array based on their order, if both lists are ordered:
var newArray = [];
for(var i=0;i<features[0].length;i++){
newArray.push({"long":features[0][i], "lat":features[1][i]});
}

Instead of literal values in your array, you will want objects:
var features = [{long: 123, lat: 234}, {long: 545, lat: 677}];
Then,
features[0]
will give you
{long: 123, lat: 234}
Which you can access by
features[0].long
features[0].lat
I hope this helps. Let me know if you have further questions.