Qooxdoo : parent child selectbox - qooxdoo

I am new at Qooxdoo framework (using 4.1)
I need to create two selectBoxs s1, s2.
s2 should reload based on the selection of the s1.
How I can do this?
Thanks

It depends if you like to use data binding or not. I would suggest to use data binding because it brings in a lot of comfort. Here is a simple sample on how to connect two virtual select boxes:
var s1 = new qx.ui.form.VirtualSelectBox();
this.getRoot().add(s1);
var s2 = new qx.ui.form.VirtualSelectBox();
this.getRoot().add(s2, {top: 30});
var data1 = new qx.data.Array(["a", "b", "c"]);
s1.setModel(data1);
s1.getSelection().addListener("change", function() {
var oldModel = s2.getModel();
if (oldModel) {
oldModel.dispose();
}
var data = [];
for (var i = 0; i < 100; i++) {
data.push(s1.getSelection().getItem(0) + " " + i);
}
var data2 = new qx.data.Array(data);
s2.setModel(data2);
});
You can test that code online using the playground: http://tinyurl.com/posmccf

Related

add and remove item to qx.ui.list.List

How can I add item at the end of this array? I didn't find examples. Did I miss something. How can I remove an element?
var rawData = [];
for (var i = 0; i < 2; i++) {
rawData[i] = "Item " + i;
}
var model = qx.data.marshal.Json.createModel(rawData);
var list = new qx.ui.list.List(model);
//var list = new qx.ui.list.List(new qx.data.Array("item 0"));
//list.add( new qx.ui.list.List("itme 2"))
//list.createItem("item 2")
//list.insertAt(0, "item2")
this.getRoot().add(list);
There is MVC pattern implementation in qooxdoo. The elegant way is to work with model not view. You can wrap JS array by qooxdoo array qx.data.Array instead of qx.data.marshal.Json.createModel. The qooxdoo array has method append which add to the end of array and remove the last element is pop method.
const data = [];
for (let i = 0; i < 2; i++) {
data[i] = "Item " + i;
}
const model = new qx.data.Array(data);
const list = new qx.ui.list.List(model);
// removing element from list
model.pop();
// adding element to end of list
model.append("Item 3");
this.getRoot().add(list);
let doc = this.getRoot();
doc.add(list, {left: 100, top: 50});
I can use list.getModel().insertAt(2, "item 3")
list.getModel().removeAt(0)

Why $http response data are not shown in angular js?

I make a example of directive in angular js .I am using this directive
https://github.com/ONE-LOGIC/ngFlowchart
when I take static data ..it show the output please check my plunker
http://plnkr.co/edit/d2hAhkFG0oN3HPBRS9UU?p=preview
but when I use $http request and make same json object .it not display the chart see my plunker using $http request .I have same data object as in static
http://plnkr.co/edit/Vts6GdT0NNudZr2SJgVY?p=preview
$http.get('data.json').success(function(data) {
console.log(data)
var arr = data
var model={};
var new_array = []
for (var i = 0; i < arr.length; i++) {
var obj = {};
obj.name = arr[i].name;
obj.id = arr[i].id;
obj.x = arr[i].x;
obj.y = arr[i].y;
obj.color = '#000';
obj.borderColor = '#000';
var p = {};
p.type = 'flowchartConstants.bottomConnectorType';
p.id = arr[i].con_id
obj.connectors = [];
obj.connectors.push(p);
new_array.push(obj);
}
console.log('new array')
console.log(new_array)
model.nodes=new_array;
var edge = [];
for (var i = 0; i < arr.length; i++) {
if (arr[i].children.length > 0) {
for (var j = 0; j < arr[i].children.length; j++) {
var obj = {};
obj.source = arr[i].con_id;
obj.destination = arr[i].children[j].con_id;
edge.push(obj);
}
}
}
model.edges=edge;
console.log(edge)
console.log("model")
console.log(JSON.stringify(model))
$scope.flowchartselected = [];
var modelservice = Modelfactory(model, $scope.flowchartselected);
$scope.model = model;
$scope.modelservice = modelservice;
})
any update ?
Working Example
It is now working.
The issue was when we load the directive first time it has no parameter value to it. So, when the chart directive try to initialize your chart with no parameter it gets an error. So, it will not work anymore.
How solve the issue?
Just give a dummy parameter upon the page load. I have given the dummy model as,
$scope.model = model;
$scope.modelservice = modelservice;
So, first your chart will display a chart based on the dummy values. After that it populates chart with the data from the server ($http.get())

ActionScript (AS3) object /JSON text input

I have a problem with ActionScript (AS3) / JSON. There is probably a really simple answer to this, so I apologize if this seems like a really noob question.
What I am trying to do is take multiple text strings, place them into an object and then have that object sent as a JSON string to a server.
Every thing else in my code works fine, accept whenever I input a piece of text into my text input box and send the object, the array produces null entries like so:
{"email":null,"last_Name":null,"first_Name":null,"date_of_birth":null,"telephone":null}
However if I replace customer.first_name = inPutfname with: customer.first_name = " John";
Then the array traces back as the following which is what I want:
{"email":null,"last_Name":null,"first_Name":John,"date_of_birth":null,"telephone":null}
So how do I take the multiple input text strings and place them into the object so that the array reads back as it does in the above example, or ideally like this example:
{"email":randomemail#email.com"last_Name":smith,"first_Name":john,"date_of_birth":27/07/1989,"telephone":012343456788}
Here is the code I have so far:
var inPutFirstname: String;
var inPutLastname: String;
var inPutEmail: String;
var inPutTelephone: String;
var inPutDob: String;
// changes customer data into an object
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
var customer:Object = new Object;
customer.first_Name =inPutFirstname;
customer.last_Name = inPutLastname; PROBLEM AREA?
customer.email = inPutEmail;
customer.date_of_birth = inPutDob;
customer.telephone = inPutTelephone;
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
//changes customer object into json string
var myJson: String = JSON.stringify(customer);
var myVariableUrl: URLVariables = new URLVariables();
myVariableUrl.data = JSON.stringify(myVariableUrl);
var myRequestUrl: URLRequest = new URLRequest();
var authHeaderUrl: URLRequestHeader = new URLRequestHeader("xxxxxx", "xxxxxxx");
myRequestUrl.method = URLRequestMethod.POST;
myRequestUrl.data = myJson;
myRequestUrl.url = "website url"
var uload: URLLoader = new URLLoader();
uload.load(myRequestUrl);
uload.load(myRequestUrl);
mySendbutton.addEventListener(MouseEvent.MOUSE_DOWN, thefunction1);
// captures text from the input and places them into the customer object
function captureText1(): void {
inPutFirstname = myFirstName.text;
inPutLastname = myLastName.text;
inPutEmail = myEmail.text;
inPutDob = myDob1.text + myDob2.text + myDob3.text;
inPutTelephone = myTele.text;
}
function thefunction1(event: MouseEvent): void {
captureText1();
trace(inPutfname);
trace(myJson);
}
Any Help would be Amazing.
Thanks guys
Your problem is that the code for creating the JSON object doesn't seem to be contained in a function, which means it will be executed immediately (considering this is probably code attached to a frame).
What you need to do is to is to wrap the code relating to creating the JSON object into a function, something like this:
(Please note that there are a lot of ways this code can be structured better, however this should illustrate some core concepts.)
var inPutFirstname: String;
var inPutLastname: String;
var inPutEmail: String;
var inPutTelephone: String;
var inPutDob: String;
function generateJSON():String {
var customer:Object = new Object();
customer.first_Name = inPutFirstname;
customer.last_Name = inPutLastname;
customer.email = inPutEmail;
customer.date_of_birth = inPutDob;
customer.telephone = inPutTelephone;
return JSON.stringify(customer);
}
function sendJSON(data)
var myVariableUrl: URLVariables = new URLVariables();
myVariableUrl.data = JSON.stringify(myVariableUrl);
var myRequestUrl: URLRequest = new URLRequest();
var authHeaderUrl: URLRequestHeader = new URLRequestHeader("xxxxxx", "xxxxxxx");
myRequestUrl.method = URLRequestMethod.POST;
myRequestUrl.data = data;
myRequestUrl.url = "website url"
var uload: URLLoader = new URLLoader();
uload.load(myRequestUrl);
}
mySendbutton.addEventListener(MouseEvent.MOUSE_DOWN, thefunction1);
// captures text from the input and places them into the customer object
function captureText1(): void {
inPutFirstname = myFirstName.text;
inPutLastname = myLastName.text;
inPutEmail = myEmail.text;
inPutDob = myDob1.text + myDob2.text + myDob3.text;
inPutTelephone = myTele.text;
}
function thefunction1(event: MouseEvent): void {
// First populate the string variables with user input
captureText1();
// Then generate the JSON string
var jsonData:String = generateJSON();
// Lastly, send the JSON string
sendJSON(jsonData);
trace(inPutfname);
trace(jsonData);
}
1st of all, can you add in function captureText1() traces for:
trace(myFirstName.text);
trace(myLastName.text);
trace(myEmail.text);
etc...
just to be sure that you have proper value in there.
And if you are, instead of using extra variables for that you can do (right after traces):
var customer:Object = new Object;
customer.first_Name = myFirstName.text;
customer.last_Name = myLastName.text;
customer.email = myEmail.text;
customer.date_of_birth = "" + myDob1.text + myDob2.text + myDob3.text;
customer.telephone = myTele.text;
var myJson: String = JSON.stringify(customer);
trace(myJson);

Using AngularFire, is it possible to to create relational-style databases? Or access the UniqueIDs?

I saw this post on Firebase's blog explaining the best way to create relational data objects using their platform. I'm struggling to translate these concepts to AngularFire, their integration with the AngularJS platform.
Specifically, I'm trying to display two linked data sets that have a one way pointer reference similar to how they described it in this example from their post:
var commentsRef = new Firebase("https://awesome.firebaseio-demo.com/comments");
var linkCommentsRef = new Firebase("https://awesome.firebaseio-demo.com/links/comments");
linkCommentsRef.on("child_added", function(snap) {
commentsRef.child(snap.name()).once("value", function() {
// Render the comment on the link page.
));
});
Question: Is it possible with the current AngularFile integration to make the pointer-style references to other data objects? And if so, can you provide an example?
Edit: I feel like I'd be able to solve these problems if I can just access the unique IDs generated by AngularFire for my data [see below]. How do I access them?
Great question!
You do need access to the unique IDs, and we recently added a feature that will give you access to it via angularFireCollection: https://github.com/firebase/angularFire/pull/26.
If you're using the implicit sync method (angularFire), then you already have access to the keys as long as you specify the 4th argument that will set the type of the collection to 'Object':
function MyController($scope, angularFire) {
var url = 'https://awesome.firebaseio-demo.com/comments';
var promise = angularFire(url, $scope, 'comments', {});
promise.then(function() {
var id = '-lw2NDTiZMFvzEWmSnYn';
console.log($scope.comments[id]);
});
}
Hope this helps!
Yes you can access the ID! Use the code below!
var chru;
var ref = new Firebase("https://myapp.firebaseio.com/users/");
var sync = $firebase(ref);
var users= syncSelect.$asArray();
$scope.users= users;
users.$loaded().then(function() {
chru = users.length;
});
$scope.specificIdOnSelect = function() {
var jj;
for (jj = 0; jj < chru; jj++) {
var keyer = users.$keyAt(jj);
var rec = users.$getRecord(keyer);
if ($scope.userSelected== rec.name) {
alert("Unique Key of " + $scope.users+ " is " + users.$keyAt(jj));
}
}
};
$scope.allIds = function() {
var jj;
for (jj = 0; jj < chru; jj++) {
var keyer = users.$keyAt(jj);
var rec = users.$getRecord(keyer);
alert("Unique Key of " + $scope.users+ " is " + users.$keyAt(jj));
}
};

How to loop range of cells and set value in adjacent column

I'm learning Google Apps Scripts for use with Google Spreadsheets.
I have a list of URLs in one column and I want to write a script to get the title element from each URL and write it in the adjacent cell. I have accomplished this for one specific cell as per the following script:
function getTitles() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheetByName("url_list");
var range = sheet.getRange("G3");
var url = range.getValue();
var response = UrlFetchApp.fetch(url);
var doc = Xml.parse(response.getContentText(),true);
var title = doc.html.head.title.getText();
var output = sheet.getRange("H3").setValue(title);
Logger.log(title);
return title;
}
This gets the URL in G3, parses it, pulls the element and writes the output in H3.
Now that I have this basic building block I want to loop the entire G column and write the output to the adjacent cell but I'm stuck. Can anyone point me in the right direction?
May look something like this:
function getTitles() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheetByName("url_list");
var urls = sheet.getRange("G3:G").getValues();
var titleList = [], newValues = [],
response, doc, title;
for (var row = 0, var len = urls.length; row < len; row++) {
if (urls[row] != '') {
response = UrlFetchApp.fetch(urls[row]);
doc = Xml.parse(response.getContentText(),true);
title = doc.html.head.title.getText();
newValues.push([title]);
titleList.push(title);
Logger.log(title);
} else newValues.push([]);
}
Logger.log('newValues ' + newValues);
Logger.log('titleList ' + titleList);
// SET NEW COLUMN VALUES ALL AT ONCE!
sheet.getRange("H3").offset(0, 0, newValues.length).setValues(newValues);
return titleList;
}

Resources