I had got the data using
WinJS.xhr({ url: url, responseType: "json" }).then(
function(result){},
function(error){}
);
I make this stuff on the button click event.
I got the data properly but can not fill them in my ListView.
So now, how can I bind the JSON data in my WinJS.UI.ListView on every click of button with my new data...? please help me for this with some simple example. because I had already checked so many links. But still I could not understand where
it should go something like this:
WinJS.xhr({ .. }).then(function xhrcomplete(req)
{
var data; // assuming you already have code that parsed json text to an object.
var items = [];
// fill code here to get items out of the data
var list = new WinJS.Binding.List(items);
// binding code will depend on whether listview has groupHeaderTemplate or not
// if not - it should be like this
listView.winControl.itemDataSource = list.dataSource; // listView is the id of the your list view control in html
}).then(null, function onerror(error)
{
// handle error case
});
Related
I'm trying to use nightmare, in node js to click on links based on the text inside the anchor text of the link.
Here's some example code:
var Nightmare = require('nightmare');
var nightmare = Nightmare({show: true})
nightmare
.goto('https://www.wikipedia.org/')
.inject('js', 'C:/users/myname/desktop/nodejs/node_modules/jquery/dist/jquery.js')
.wait(500)
var selector = 'a';
nightmare
.evaluate(function (selector) {
// now we're executing inside the browser scope.
return document.querySelector(selector).innerText;
}, selector) // <-- that's how you pass parameters from Node scope to browser scope
.end()
.then(function(result) {
console.log(result)
})
I'm really unclear on why the inner text of all tags are not returning? I thought I could maybe do an if statement in the .evalution method, so that it would restrict the link to be clicked on to "English" for instance.
Any idea how to click on links based on the link text?
As far as I know, there is no way to select a DOM element solely on what it contains. You'll either need to select all of the anchors (like you're doing now) and filter to what you want based on innerText then issue click events directly, or you could inject jQuery and use :contains and $.click() to issue the click.
Also, if you want all of the text from the tags, you'll likely want to use document.querySelectorAll().
As an example to get all of the text:
.evaluate(function (selector) {
return document.querySelectorAll(selector)
.map(element => element.innerText);
}, selector)
I have a list with items.
When I click any of these items, I copy its id-value into a form text-field.
Everytime I click, it replaces the value, which is correct by default. But what I would like to add, is a way for the user to hold down a key on their keyboard, and when they then click, they just .append whatever they just clicked into the same form field.
Here's my jQuery-code I'm using for the first/default scenario:
$(function(){
$('ul#filter-results li').click(function(){
var from = $(this).attr('id'); // get the list ID and
$('input#search').val(from+' ').keyup(); // insert into text-field then trigger the search and
$('input#search').focus(); // make sure the field is focused so the user can start typing immediately
});
});
Is there a way to implement some sort of keyboard key-listener?
Something like:
if (e.shiftKey){
.append('this text instead')
}
haven't tried out to see if shiftKey is even any valid name here
shiftKey is of one of the properties of the event object and is valid to be used. try this:
$(document).on('keyup click', function(e){
if (e.shiftKey) {
$('input#search').focus()
$('input#search').val(e.target.id)
}
})
DEMO
$('ul#filter-results').on('click', 'li', function(e) {
if(e.shiftKey) {
do something;
} else {
do something else;
}
});
There is a jQuery plugin for extended click.
You could try that or see how they have done it and implement it yourself.
ExtendedClick plugin
Hope this helps.
This is what I ended up with:
I switched over to altKey because shiftKey marked a lot of text when I clicked.
Didn't do anything besides it doesn't look good...
$(function(){
$('ul#filter-results li').click(function(e){
var text = $(this).attr('id'); // get the ID
var input = $('#search'); // form field to insert text into
if (e.altKey){ input.val(input.val()+', '+text+' ').keyup(); } // fetch whatever is already there, and add some more
else { input.val(text+' ').keyup(); } // just replace whatever is already there
$('#search').focus();
});
});
Thanks for good suggestions...
I have a grid filled with ajax, the user enters new data and call back to the ajax method that fills the grid, the problem I have is that the grid are duplicate data, I have tried before upgrading the grid to fill with a empty strore but does not work,
var gridColeccion = dijit.byId("colectionGrid");
var dummy = {items: []};
var newEventStoreColeccion = new dojo.data.ItemFileReadStore({clearOnClose:true,data:dummy});
newEventStoreColeccion.fetch();
gridColeccion.setStore(newEventStoreColeccion);
gridColeccion._refresh();
folderConsult(token); // This metod fill the grid again
// This is part of code in folderConsult;
var datosColeccion = {
items: itemsColeccion
};
var gridColecccion = dijit.byId("colectionGrid");
nuevasColecciones= new dojo.data.ItemFileReadStore({clearOnClose:true,data: datosColeccion});
nuevasColecciones.fetch();
gridColecccion.setStore(nuevasColecciones);
gridColecccion._refresh();
I hope someone can help me, THX.
while(grid.store._getItemsArray().length!=0)
{
grid.store.deleteItem(grid.store._getItemsArray()[0]);
}
grid.store.save();
Try using nuevasColecciones.close() instead of nuevasColecciones.fetch() and provide a url param instead of the data param. That should refresh the data in the store, and as long as you have already posted the new data, you will get all of the objects back
I am writing a Google extension. Here my content script modifies a page based on a list of keywords requested from background. But the new innerHTML does not show up on the screen. I've kluged it with an alert so I can see the keywords before deciding to actually send a message, but it is not how the routine should work. Here's the code:
// MESSAGE.JS //
//alert("Message Page");
var keyWordList= new Array();
var firstMessage="Hello!";
var contentMessage=document.getElementById("message");
contentMessage.value=firstMessage;
var msgComments=document.getElementsByClassName("comment");
msgComments[1].value="Hello Worlds!";//marker to see what happens
chrome.extension.sendRequest({cmd: "sendKeyWords"}, function(response) {
keyWordList=response.keyWordsFound;
//alert(keyWordList.length+" key words.");//did we get any keywords back?
var keyWords="";
for (var i = 0; i<keyWordList.length; ++i)
{
keyWords=keyWords+" "+keyWordList[i];
}
//alert (keyWords);//let's see what we got
document.getElementsByClassName("comment")[1].firstChild.innerHTML=keyWords;
alert (document.getElementsByClassName("comment")[1].firstChild.innerHTML);// this is a band aid - keyWords does not show up in tab
});
document.onclick= function(event) {
//only one button to click in page
document.onload=self.close();
};
What do I have to do so that the text area that is modified actually appears in the tab?
(Answering my own question) This problem really has two parts. The simplest part is that I was trying to modify a text node by setting its value like this:
msgComments1.value="Hello Worlds!"; //marker to see what happens
To make it work, simply set the innerHTML to a string value like this:
msgComment1.innerHTML="Hello Worlds!"; //now it works.
The second part of the problem is that the asynchronous call to chrome.extension.sendRequest requires a callback to update the innerHTML when the reply is received. I posted a question in this regard earlier and have answered it myself after finding a solution in an previous post by #serg.
I am intiating a loading panel in init method and hiding it in ReturnDataPayload event.This is working perfectly when data Table has got some values in it.But when there is no data returned from database , the control is not going to returnDataPayLoad event.Please help me in finding an event which will be fired even when the response doesn't have any data or tell me a way to hide the loading panel.
If you want a custom behavior, use DataSource's sendRequest method of the dataTable's dataSource
(function() {
var YdataTable = YAHOO.widget.DataTable,
YdataSource = YAHOO.util.DataSource;
var settings = {
container:"<DATATABLE_CONTAINER_GOES_HERE>",
source:"<URL_TO_RETRIEVE_YOUR_DATA>",
columnSettings:[
{key:"id", label:"Id"}
],
dataSourceSettings:{
responseType:YdataSource.TYPE_JSON,
responseSchema:{
resultsList:"rs",
fields:[
{key:"id"}
]
}
},
dataTableSettings:{
initialLoad:false
}
}
var dataTable = new YdataTable(
settings.container,
settings.columnSettings,
new YdataSource(
settings.source,
settings.dataSourceSettings),
settings.dataTableSettings);
})();
keep in mind No matter which source is your data: XML, JSON, JavaScript object, TEXT, you always will get your data in a unified way through DataSource's sendRequest method. So when you want to retrieve your data and, at the same time, add custom behavior, use it
dataTable.getDataSource().sendRequest(null, {
success:function(request, response, payload) {
if(response.results.length == 0) {
// No data returned
// Do what you want right here
// You can, for instance, hide the dataTable by calling this.setStyle("display", "none");
} else {
// Some data returned
// If you want to use default the DataTable behavior, just call
this.onDataReturnInitializeTable(request, response, payload);
}
},
scope:dataTable,
argument:dataTable.getState()
});
The properties of the response are
results (Array): Your source of data in a unified way. For each object in the results Array, There is a property according to responseSchema's fields property. Notice i use response.results.length to verify if some data has been returned
error (Boolean): Indicates data error
cached (Boolean): Indicates cached response
meta (Object): Schema-parsed meta data
On the YUI dataTable page, look for Loading data at runtime to see some built-in functions provided by YUI dataTable
I hope it can be useful and feel free to ask for help for anything else you want about YUI. See a demo page of nice features of YUI dataTable