Showing or hiding a button based on contents of a field in a database - ios

I am trying to show or hide a button based on the contents of a particular database field. I have the field defined as 'text', as the field may contain something like 1-1 or 1-20 or 0. If the field (arref1) is not equal to 0 then I want to show my button. Otherwise hide the button. Here is what I have so far but it dosen't work:
var resultRule = db.execute('SELECT arref1 FROM genrules WHERE title="'+client+'"');
if (resultRule!='0') {
var appliedRule1 = Ti.UI.createButton({
title:' Applied Rule ' + rows.fieldByName('arref1') + '',
bottom:120,
left: 80,
width: 'auto',
height:40,
borderRadius:5,
textAlign: 'center',
color:'#FFFFFF',
backgroundColor:'#7b4336',
backgroundSelectedColor:'#cc9933',
backgroundImage: 'NONE',
font:{fontSize:'20dp'}
});
win.add(appliedRule1);
appliedRule1.addEventListener('click',function(e)
{
var win = Ti.UI.createWindow({
url: 'appliedruledetail.js',
title:' Applied Rule' + rows.fieldByName('arref1') + ''
});
var client = '' + rows.fieldByName('genrule') + '' ;
win.client = client;
Ti.UI.currentTab.open(win);
}
);
} else{};

db.execute returns a Titanium.DB.ResultSet (which is an object) not a string.
Here is how you use a result set:
// Get the row with execute, returns a resultSet
var row = db.execute('SELECT * FROM genrules WHERE title="'+client+'"');
// Make sure its a valid row
if (row.isValidRow()){
// Now get the field from the current row
if(row.fieldByName('arref1') != '0') {
// Add your button here
}
}
row.close(); // Close the result set since were done with it
I heavily borrowed from this example in the documentation

Related

How to add more attributes in tooltip series in Angular NVD3 line chart

I need to add more attributes in tooltip series in Angular NVD3 line chart, if possible, without modifying the NVD3 source code. I know there are similar posts, but none of them covers this scenario.
Here is my tooltip section in options:
interactiveLayer: {
tooltip: {
contentGenerator: function (d) {
// output is key, value, color, which is the default for tooltips
console.log(JSON.stringify(d.series[0]));
//{"key":"Name","value":1000,"color":"rgba(255,140,0, 1)"}
// and I need more attributes to be added
// into data points, such as label, count, location (see data below)
//{"key":"Name","value":1000,"color":"rgba(255,140,0, 1), "label" : "some label", "count" : 23, "location" : "Paris"}
}
}
}
And here is my data:
$scope.data =
[
{
values: FirstGraphPointsArray,
key: 'Name',
color: 'rgba(255,140,0, 1)'
},
{
values: SecondGraphPointsArray
key: 'City',
color: 'rgba(255,140,0, 1)'
}
]
Finally, the structure of the arrays in data:
FirstGraphPointsArray -> [{ x: xVariable, y: yVariable, label: labelVariable, count: countVariable, location : locationVariable }, {second element...}, {third element...}];
SecondGraphPointsArray -> [a similar array...]
How to get more attributes (label, count, location) from these arrays into the contentGenerator: function (d). As mentioned above, I only receive the default ones from within function parameter (d)
console.log(JSON.stringify(d.series[0]));
//{"key":"Name","value":1000,"color":"rgba(255,140,0, 1)"}
I came up with a solution and wanted to share it, in case someone else comes across the same task. I ended up accessing some of the parameters from d through the default route - function(d), while some of the custom ones - directly from $scope.data.
Important: using the d.index, which indicates the place of the data point in the list is critical hear. This makes sure that for any given index the parameters pulled from the function(d) and those of pulled directly, belong to the same data point (see the code below).
interactiveLayer: {
tooltip: {
contentGenerator: function (d) {
var customTooltipcontent = "<h6 style='font-weight:bold'>" + d.value + "</h6>";
customTooltipcontent += "<table class='custom-tooltip-table'>";
customTooltipcontent += "<tr style='border-bottom: 1px solid green;'><td></td><td>Name</td><td>Value</td><td>Count</td></tr>";
for (var i = 0; i < d.series.length; i++) {
customTooltipcontent += "<tr><td><div style='width:10px; height:10px; background:" + d.series[i].color + "'></div></td><td>" + d.series[i].key + "</td><td>" + d.series[i].value + "</td><td>" + $scope.data[0].values[d.index].count + "</td><td>" + $scope.data[0].values[d.index].location + "</td></tr>"
}
customTooltipcontent += "</table>";
return (customTooltipcontent);
}
}
}

How to get Node Coordinates Data in Sankey Graph

I'm trying to create something similar to the image below. Where each column has a heading with it.
I know that chart.renderer.text can be used to create & place custom text on chart. However, I'm unable to find a way to fetch the column/node coordinates data(x,y) which would help me place them.
Also is there a programmatic way to do this task. For example, a function that fetches all the columns coordinates and populates all the headings from an existing list.
To summarize:
How to fetch a columns (x,y) Coordinates?
How to dynamically place headings for all columns from a list?
Image
You can get the required coordinates and place the headers in render event, for example:
events: {
render: function() {
var chart = this,
series = chart.series[0],
columns = series.nodeColumns,
isFirst,
isLast,
xPos;
if (!series.customHeaders) {
series.customHeaders = [];
}
columns.forEach(function(column, i) {
xPos = column[0].nodeX + chart.plotLeft;
isFirst = i === 0;
isLast = i === columns.length - 1;
if (!series.customHeaders[i]) {
series.customHeaders.push(
chart.renderer.text(
headers[i],
xPos,
80
).attr({
translateX: isFirst ? 0 : (
isLast ?
series.options.nodeWidth :
series.options.nodeWidth / 2
),
align: isFirst ? 'left' : (
isLast ? 'right' : 'center'
)
}).add()
)
} else {
series.customHeaders[i].attr({
x: xPos
});
}
});
}
}
Live demo: https://jsfiddle.net/BlackLabel/6Lvdufbp/
API Reference:
https://api.highcharts.com/highcharts/chart.events.render
https://api.highcharts.com/class-reference/Highcharts.SVGRenderer#text

How to Add Custom Data to Highchart.js Tooltip

Can you please take a look at This Demo and let me know how I can add some custom data from an array to tooltip in highchart?
var extras = ["Values More Than 1000", "Values More Than 2000", "Values More Than 3000", "Values More Than 4000", "Values More Than 5000"];
As you can see the array length is equal to the column numbers so the extras[0] with go with tooltip for column 1
some thing like
You can customize the tooltip with the formatter option.
tooltip: {
formatter: function () {
var index = this.series.points.indexOf(this.point);
return extras[index] + ': ' + this.y;
},
style: {
width: 250,
fontSize: '15px'
}
}
Here's a jsFiddle:
http://jsfiddle.net/opgp10mj/3/

JQuery Mobile - Dynamic Count Bubbles

I am creating a JQuery Mobile application that has a listview. I am populating that listview with the results of a web service. Because of this, the items in the list view are being populated as shown here:
$.each(results, function (i, result) {
var s = "<li><h2 style='padding-left:40px;'>" + result.title + "</h2><p style='padding-left:40px;'>";
s += result.subTitle;
s += "</p><span class='ul-li-count'>" + result.count + "</span></li>";
$("#resultListView").append(s);
});
$("#resultListView").listview("refresh");
My listview is being populated correctly. The value for the count bubble is showing. However, the UI does not render the bubble. Is there a way to dynamically build a result set with count bubbles in a list view? If so, how?
Thank you!
Your way should work. The only thing I can think of is that the HTML is not valid.
Anyway, I created a simple version to show that it's possible. http://jsfiddle.net/kiliman/HDUqp/
Basically, just build up the HTML for <li/> and append to the list, then call .listview('refresh')
$('#page1').bind('pageinit', function(e, data) {
var n = 0;
$('#addResult').click(function(e) {
var $list = $('#resultListView');
n++;
$('<li/>')
.append($('<h2>', { text: 'Title ' + n }))
.append($('<p>', { text: 'SubTitle ' + n }))
.append($('<span />', { text: n, class: 'ui-li-count'}))
.appendTo($list);
$list.listview('refresh');
});
});

Custom ListView Row, can no longer select rows

Here's my ScrollView:
middle: SC.ScrollView.design({
layout: { top: 36, bottom: 32, left: 0, right: 0 },
backgroundColor: '#ccc',
contentView: SC.ListView.design({
contentBinding: 'Spanish.wordsController.arrangedObjects',
selectionBinding: 'Spanish.wordsController.selection',
contentValueKey: "word",
contentDisplayProperties: 'word english'.w(),
selectOnMouseDown: YES,
exampleView: Spanish.CustomListItemView
})
})
and here is my custom listView row:
Spanish.CustomListItemView = SC.View.extend({
render: function(context, firstTime){
var content = this.get('content');
var word = content.get('word');
var english = content.get('english');
context = context.begin().push(' %# (%#)'.fmt(word,english)).end();
return sc_super();
}
});
The above works as expected, except that I can no longer select views. When I comment out "exampleView: Spanish.CustomListItemView" I can select rows, but they are no longer formatted properly. Why can I no longer select rows when I use exampleView?
Subclass SC.ListItemView instead.
Remove the return sc_super(); line.
Change the context = context.begin().push(' %# (%#)'.fmt(word,english)).end(); line to:
context.push(' %# (%#)'.fmt(word,english));
It should work now.
After getting help on IRC, I made the following changes which fixed the problem:
Spanish.CustomListItemView = SC.ListItemView.extend({
render: function(context, firstTime){
var content = this.get('content');
var word = content.get('word');
var english = content.get('english');
context.push(' %# (%#)'.fmt(word,english));
}
});
I was subclassing the wrong class (note the first line)

Resources