jquerymobile url parameters - jquery-mobile

Have asked two questions and not getting an answer and having spent a few hours trying to find the answer without success I am wondering if someone can finally help me.
I need to generate dynamic urls and pass through parameters on jquerymobile.
example..
Menu 2
Result No. 4
The above urls need to be dynamic and I need to be able to pass through a parameter of ID.
I then need to get the id parameter on the given page.
I have read lots regarding changePage etc but I can specify in the function which page will be next as it needs to be dynamic. I also need the ajax transitions to work so ajax-false needs to be true.
Please help once and for all and provide me with sample code.
Kind Regards.

Ok, to get the url parameter on the page you navigated in, use something similar to the following.
It uses pageshow event to get the ID from the current URL.
I have used the function from the answer on this question - Get escaped URL parameter:
$(document).on("pageshow", function(event, data) {
var id = getURLParameter("id");
console.log("ID = " + id);
});
function getURLParameter(name) {
return decodeURI(
(RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
);
}

If the above regex doesn't work means try with this change
function getURLParameter(name) {
return decodeURI(
(RegExp(name + '=' + '(.+?)(&|$)').exec(window.location.href)||[,null])[1]
);
}

Related

Info Window URL needs to be prefixed with http NOT the default https

I am using the following code in the fusion tables 'customize info window' to create hyperlinked URL's from a column in my table:
"{URL}"
This works fine in returning the clickable hyperlink in the info box except fusion maps by default tacks on https: instead of http: when the link is clicked. This causes problems when the user clicks the hyperlink and it tries to take them to a secure site when in fact it is not secure. The browsers throw up all sorts of warnings that will scare the pants off a lot of users who don't know what is happening.
Does anybody know how to remedy this and have the default be http and not the current https?
Thanks, Shep
You may want to abandon the "{URL}" approach and display the hyperlink with some simple HTML. This example from Google shows how to modify the info window's HTML in Javascript:
google.maps.event.addListener(layer, 'click', function(e) {
// Change the content of the InfoWindow
e.infoWindowHtml = e.row['Store Name'].value + "<br>";
// If the delivery == yes, add content to the window
if (e.row['delivery'].value == 'yes') {
e.infoWindowHtml += "Delivers!";
}
});
Changing the e.row['Store Name'] to your URL column name (maybe, e.row['URL']) and surrounding by a couple of hyperlink tags <a> should do the trick:
e.infoWindowHtml = "<a href='" + e.row['URL'].value + "'>Click here!</a>";
There are three ways:
Specify a full URL including protocol in your data
Use Link here in a custom info window layout
Completely override the content as in the answer above
I would recommend #1 because you can choose the right protocol for every link. However #2 is probably easier in that you can leave your data the way it is.

how to trigger angular parsers without inputing anything in the field

As the subject states, how do I trigger the actions to take place inside a
modelController.$parsers(...)
without user input... the only way I can think of is wrapping them inside a function and call it, but is there a better way to trigger
**//pseudo
$(modelController).trigger('just got dirty');**
the reason I would need this is to trigger the input field to validate itself on submitting page.
I have found a way to solve this - just call the parsers with the model value:
angular.forEach(ngModel.$parsers, function (parser) {
parser(ngModel.$viewValue);
});
It`s so simple, and it seems to be the most correct solution.
This question is actual for me also... Because i am resolving this issue with:
var triggerParsers = function() {
var val = ngModel.$viewValue;
ngModel.$setViewValue(null);
ngModel.$setViewValue(val);
};

Event listener for multiple elements - jQuery

In the ASP MVC page I'm currently working on, the values of three input fields determine the value of a fourth. Zip code, state code, and something else called a Chanel Code will determine what the value of the fourth field, called the Territory Code, will be.
I just started learning jQuery a couple weeks ago, so I would first think you could put a .change event that checks for values in the other two fields and, if they exists, call a separate method that compares the three and determines the Territory code. However, I'm wondering if there is a more elegant way to approach this since it seems like writing a lot of the same code in different places.
You can bind a callback to multiple elements by specifying multiple selectors:
$(".field1, .field2, .field3").click(function() {
return field1 +
field2 +
field3;
});
If you need to perform specific actions depending on which element was clicked, another option would be to create a function which performs the actual computation and then invoke that from each callback.
var calculate = function() {
return field1 +
field2 +
field3;
};
And then invoke this function when on each click:
$(".field1").click(function() {
// Perform field1-specific logic
calculate();
});
$(".field2").click(function() {
// Perform field2-specific logic
calculate();
});
// etc..
This means that you do not repeat yourself.
This works for me
jQuery(document).on('scroll', ['body', window, 'html', document],
function(){
console.log('multiple')
}
);
Adding another possibility, just in cased this may help someone. This version should work on dynamically created fields.
$("#form").on('change', '#Field1, #Field2, #Field3', function (e) {
e.preventDefault();
console.log('something changed');
});

JQuery table sorter pager with AJAX - sorting not working ok

I have a problem with JQuery table sorter pager plugin.
I am trying to use paging with AJAX call. It seems to work OK for most cases, but I am unable to get the sorting working.
The problem is that when the request is made it always looks like (assuming the code from example here):
http:/mydatabase.com?page=0&size=100&{sortList:col}
just like the last parameter {sortList:col} is never actually replaced with proper sorting column.
If I'm reading the example correctly the request for sortList = [[2,0],[3,0]] should actually look like:
http:/mydatabase.com?page=0&size=100&col[2]=0&col[3]=0
But in my case it never is. Also when I click on the header the sorting is performed, but no request is made.
Is there anything I am missing in the linked example?
EDIT
The first part of my problem has been solved by replacing the plugin with the newest version.
For the second part, I still cannot get a request when clicking (sorting) columns. The ajaxProcessing function is almost exactly the same as in the example here, only headers variable is renamed.
As Mottie sugested I am posting an example result from AJAX call (MS MVC JsonResult):
{
"total_rows":1,
"headers":["Id.","Date","User name","File name","status","Hash","Link"],
"rows":[
{
"Id":"21",
"ReceiveDate":"02.12.2012",
"UserName":"John Doe",
"FileName":"test.txt",
"Status":"",
"Hash":"4A71FD2E12F7E04ED0C04E17476BD1BC5F823C8F",
"FileNameLink":"\u003ca style=\"padding-left:10px\" href=\"GetFile?Id=21&fileName=test.txt\"\u003eSave\u003c/a\u003e"
}]
}
Regards
I apologize, but I didn't get a chance to thoroughly test the latest changes to the pager. Some of the code was written by someone else, so I might have missed something obvious.
Anyway, this might be the bug that is causing you problems. It resets the table to the first page after each sort... I'll have fixed in the next update.
In the pager plugin, lines 460-470 is this code:
.bind('filterEnd.pager sortEnd.pager', function() {
//Prevent infinite event loops from occuring by setting this in all moveToPage calls and catching it here.
if ($.data(table, 'pagerUpdateTriggered')) {
$.data(table, 'pagerUpdateTriggered', false);
return;
}
c.page = 0;
updatePageDisplay(table, c);
moveToPage(table, c);
changeHeight(table, c);
})
Just change the c.page = 0 to this:
if (e.type === 'filterEnd') { c.page = 0; }
and add an e to the function(e).

cucumber , jQuery and redirects

I have a select tag on my page, I have made via jQuery on domready a listener for the change event. In this listener I redirect the user to the same page with a parameter in the url.
When I test the functionality manual, it works very well.
When I run the test, it fails, the redirect doesn't work.
How I can make it work ?
#javascript
Scenario:
When I select "2010" from "year_select"
And I wait 5 seconds
Then "2010" should be selected for "year_select"
Then I should see "time_sheet?year=2010" with html
The test fails, I see time_sheet?year=2011 (the default value) in my html source, manual I see the correct value. It is not updated via Javascript, but according to te year variable passed in the url (after the redirect)
My jQuery code:
jQuery(document).ready(function(){
var yearSelect = jQuery("#year_select");
yearSelect.change(function(){
window.location = "/time_sheet_admin?year="+yearSelect.val();
});
});
What I make wrong ?
I think u have missed out _admin in the scenario. Use time_sheet_admin instead of time_sheet in the scenario. If my suggestions is useless sorry for that.
What I usually do for testing complex JS stuff is to put them in a function and then test if that function was called:
selectChanged = function() {
window.location = "/time_sheet_admin?year="+jQuery("#year_select").val();
}
*note no need for the variable assignment because you only called it once.
then in your feature:
Then I should see "time_sheet?year=2010" in the url
step definition:
When /Then I should see "time_sheet?year=2010" in the url/ do |seconds|
page.execute_script("selectChanged()")
end

Resources