I have a table inside of appmaker that I've added checkboxes to like so:
I'd like to get a list of the emails from entires that the user checks. At this point I'm not even able to access the status of a single checkbox. This is the current code snippet I tried adding to a button:
console.log(widget.parent.parent.parent.children.Panel1.children.Table3Panel.children.Table3.children.Table3Body.children.Table3Row.children.UserSelectionCheckbox.value);
I get the error:
Cannot read property 'children' of undefined
at Home.Panel1.OuSelectPanel1.Button6.onClick:1:133
I was able to use the autofill to write this entire statement, why can't it find the child object? Is there any way to reference this list directly without going down the tree from the widget or the app root?
For this type of functionality the autofill (intellisense) will not work for you. You need to address the children differently when you try to get a collection of rows from a table. I would suggest code similar to this for your button onClick event:
var rows = widget.root.descendants.Table3Body.children._values;
var emails = [];
for (var i in rows) {
var value = rows[i].children.Checkbox1.value;
if (value) {
emails.push(rows[i].datasource.item.Email);
}
}
console.log(emails);
Again the auto complete code feature simply won't work after you choose the _values, which will return all immediate children of your table body, which is what you want.
based on the 1:133 it seems to be saying that Table3Row has no children. I wonder if using widget.root.descendants.Table3Row might be a different way of doing it address the particular table.
Related
(Apologies in advance for the poorly worded question.)
Not sure if this is even possible - Have not been able to find any documentation regarding this...
I have a datasource whose records contain fields of information on certificates.
For each record in the data source I want to create a label widget on a specified panel. (The panel has been already been created on an app maker page.)
Going to put some pseudo code below to show what I am hoping to achieve:
var length = app.datasources.Certificates.items.length;
var records = app.datasources.Certificates.items;
for (var i =0; i <length; i++){
app.pages.A_Edit_Certificate_Requirements.descendants.Panel1.createNewWidget(label,text = records[i].Certificate_Name)
}
.newWidget(type of widget, property of widget to configure) is the pseudo portion.
Anyone know if something like this is even possible?
Reason I am looking to do it via this method is to keep the page as dynamic as possible.
If you do want to proceed with creating the labels dynamically yourself here would be some sample code to get the same accomplished. In order for this to work your panel datasource would need to be set to 'Certificates' and the code would need to be attached to the panel's onDataLoad event:
widget.datasource.items.forEach(function(item) {
var node = document.createElement('div');
node.className = 'app-Label';
node.style.margin = '8px';
node.textContent = item.Certificate_Name;
widget.getElement().appendChild(node);
});
So I have setup a model/table that users will use as a project task list. I would like it so that when they change the Status (a field in the model) of an item to either Completed or Cancelled it is hidden.
That way they are only dealing with active entries. But I would also like them to be able to view these hidden (archived) items if needed.
I added the following code to the onAttach option of the table
var datasource = app.datasources.Projects;
datasource.query.filters.Status._notContains = 'Completed';
datasource.load();
And then I have a button with the following code so they can see hidden/archived items:
widget.datasource.query.clearFilters();
widget.datasource.load();
app.closeDialog();
var datasource = app.datasources.Projects;
datasource.query.filters.Status._contains = 'Completed';
datasource.load();
It works, but I feel like there might be a better/more elegant way to accomplish this. Especially since it looks like the app has to load then data, THEN filter it (which results in a slower load). (I think I might have some redundant code in there as well)
Also I feel like I am missing something with my syntax, because I can't get it to filter out Completed AND Cancelled.
Thank you for your help!
If you have a single page of items in the table and there aren't many items, then you can filter on the client side. For example, you can use a binding expression to add a "projectHidden" style to the row based on some logic and then use CSS to change the visibility of the row.
For your second code block, there is no reason to clear filters, load, set the filters and then load again. Just clear the filters, set the new filter, and call load. Also if you are manually controlling the query load, then you might want to uncheck the setting in the data source to automatically load data.
var datasource = app.datasources.Projects;
datasource.query.filters.Status._notEquals = 'Completed';
datasource.query.filters.Status._notEquals = 'Cancelled';
datasource.load();
I've looked around and tried a few things but I can't seem to get it to work. I want to be able to update the value stored in input$someVar from a bit of js code. What I need to on a certain element click, I need to update the input$someVar value. I know there are functions like "updateSelectInput()" but those are called from the server.
I can physically change the value of the data in the HTML that is used int he data attribute and that is displayed, but the server doesnt see this as a change and the input$someVar stays the same.
I have tried
var selectBind = Shiny.inputBindings.bindings[5];
selectBind.binding.setValue('#loc', newValue);
within an event handler, where #loc is the id of the input element, in hope that I could do it that way but this gives me an error.
Is there a way to do the functionality of "updateSelectInput()" within java script in the ui?
Yes, there is a way. Use the JavaScript function Shiny.onInputChange.
// change the value of an input
document.getElementById("id").value = "value";
// report the change to shiny
Shiny.onInputChange("id", "value");
I am new to Web UI, Dojo, Java etc. If you are referring any advance topic please give some reading reference. It will help.
Context:
I have Gridx design using JsonStore, which takes a target + id for URL. With fixed "id" Grid loads well.
I have Dynamic Tree. It is working fine with lazy-loading etc.
Objective:
Based on click (or dblclick) event for a given node in Tree, I have to load Gridx with data. Hence, if tree node "id":7 is clicked, then JsonStore: /target/7 should be fetched and get loaded in Gridx.
Issues:
As you can guess, at start there is no valid "id" property to fill in JsonStore. In click event handler of tree, I will get this value, upon a user click. Hence, can't call gridx.startup() in "ready". Though I have "placed" the widget in "ready".
Hence, I have following snippet to handle,
<
// this function is called from tree event handler
function LatestTabGridxLoad( id ) {
console.log( "ID %s fetched.", id );
LatestTabGridxStore.idProperty = id;
LatestTabGridx.startup();
LatestTabGridx.body.refresh();
}
ready(function()
{
TabLatestAssetTree.startup();
LatestTabGridx.placeAt( "ReportMiddleTabLatestCenterContainer" );
}
Now, trouble is, at first time loading, JsonStore GET fired with /target/ alone, without any "id" without any user click. Hence, server responds with 405. Subsequently, when user clicks, again same HTTP GET without "id" results in HTTP 405. I am not able to somehow feed "id" to the GET URL. I have checked JSON, it is in perfect shape, as it works in standalone table, that is declarative(ly) defined.
Please suggest me ways to link a TREE node through its "id" to Gridx. Also suggest, if approach I am taking is right way to solve this problem.
Sorry, misunderstanding of the question. I thought it was about gridx tree but it is about regular gridx controlled by another widget.
The problem is in this line:
console.log( "ID %s fetched.", id );
LatestTabGridxStore.idProperty = id;
'idProperty' is the name of the JSON attribute which stores the ID. This will not change with each selection. If it is not set, JsonStore will assume it to be 'id'. What you intended to do was to modify the target property of the store to include the ID. This can done directly and will look something like the following (details are application specific)
LatestTabGridxStore.target = (someURL) + '/' + id;
After that, the content of gridx needs to be replaced using the new store setting. There are few ways to do it, the simplest being destroying the current gridx instance and replacing it with another one which uses the altered store.
Is there a way to get the selected value (or text, or index) of a select box that the server fills (using ASP.NET) in the client? I've tried $("#ID").val() - but the only time that works is when I continue to another page and then go back. Even then, the value that is returned is the previously selected value - if the user changes the selection, it's not registered unless they leave the page and go back. Go easy on me, I'm new at this...
Update: Tried using a regular html select, same issue (just with a populated entry). Let me elaborate on what I'm trying to do: in a separate page, I'm getting results for an autocomplete search box. The select boxes are for filters. Naturally, if the user selects a filter, I don't want to suggest items that are no longer valid. I'm looking for the keys in the ProcessRequest method of the page that contains autocomplete info.
public override void ProcessRequest(HttpContext context)
{
string respString;
string qsKey = "q";
Customer searchCust = Session[Data.Selected_Customer] as Customer;
Dictionary<string, string> qsDict = context.Request.QueryString.ToDictionary(qsKey);
Shouldn't I get the results (for instance '&ID=foo' on the last line # context.Request.QueryString?
If you want the actual selected item itself:
$("#ID option:selected");
are you sure that 'ID' is really the id of the select box ? been awhile since i used asp.net but i remember it mucked with identifiers a lot
I use the code (below) to manipulate an ASP.NET generated select box. Within the code I obtain the value of the original select box (item). Also consider using the .text() function.
var setValue = function(item){
//if value isn't already selected, postback
if(input.value != item.text())
if(select.attr('onchange'))
eval(select[0].attributes['onchange'].nodeValue);
//set input box value
$(input).val(item.text());
$(input).removeClass('empty');
//select original ASP.NET select value (hidden)
select.val(item.text());
$(lookup).hide();
//show type if present
$('.selectType').show();
};
Hope this helps.