How can I change the title of a dynamic page? - jquery-mobile

I have a jQuery Mobile app that's just like the dynamic page sample from the jQuery Mobile documentation http://jquerymobile.com/test/docs/pages/dynamic-samples/sample-reuse-page.html.
Everything works fine, but just as in the example I can't get the page titles to change accordingly to the requested page. On the basis of the example: When you click the category Colors in the Categories section, the new page has the title Colors, but when you go back and then select Vehicles, the page title is still Colors. How can I fix this?
I tried $page.attr('data-title', category.name) in the showCategory function but it won't work. Any ideas?

You can also use something like this -
$("title").html(category.name);

I don't see the behaviour you're describing in the example. However, to change the title wouldn't this do the job?
document.title = category.name;

Related

jqGrid: edit form in the subgrid area accordion

We are using Jqgrid but we need to perform a custom editing.
In particular we want to view/edit the detail of a row inside the accordion of a subgrid area (instead of real subgrid)...
Basically we are looking for a way to redirect the content of the edit popup to the subgrid area.
Anyone have some ideas about how to do it?
Peter
If I understand correct the problem you may look at this demo in case you use Guriddo jqGrid JavaScript. In your case the html file can contain template form, where you can get the values from the row and put it in the form.
If you have difficulties we can prepare a online demo.

One page website: Rewrite URL in address-bar when clicking an anchor-link

I have set up a one-page, horizontal scrolling website with several anchors combined with DIV-id's. The website has five pages side-by-side that automatically render full-page based on the visitors browser-window.
The menu contains seven hyperlinks that address different anchors (div-id's) on the page (for example: http://www.url.com/#partsix). When they are clicked, the visitor will automatically be scrolled to the anchor part of the page. This works fine and really smooth.
The problem i'm dealing with is that, since the page is not being reloaded, the address-bar is not updated. So if a visitor wants to link to a page, or, for example, like the URL with a facebook button, it will be very difficult.
Is there a way to rewrite the address bar with the anchorlink without reloading the page?
EDIT: I have found out that i can user the action onclick="window.location.hash = hash;" on the hyperlinks. This will return the hash of the anchor it is scrolling to in the address bar. Works like a charm. But: my menu plugin does not let me add this action to the hyperlinks. So i wanted to check if i can use javascript to apply this action to all hyperlinks in the same li class. Does anyone know how?
The li class that contains all menu links is 'mc_menu mc_depth_2'

jquerymobile button's css not applied

I'm trying to add a delete button to a custom div. However when the page is loaded, the jquery mobile button does not take the format of jquery and displays it like a hyperlink.
var currDelButton = $("<a>").attr("href","#").attr("data-role","button").attr("data-icon","delete").attr("data-iconpos","left").text("حذف");
anyone has an idea about this issue?
Best Regards
Ali
If you are adding the button after the page is loaded then you need to refresh the element for example $("#mybutton").button(); should work.
here is a working example with the code you provided: http://jsfiddle.net/ashanova/RQVd8/1/
call the .page for the main wrapper where new buttons are added.
$("#content").page();

Ajax pagination like Twitter

Is there any plugin/gem or an easy way for accomplish a pagination functionality like Twitter?
This means, showing a "More" button that shows more posts (for example) below once it's clicked, using Ajax.
If there's any easy way for modifying something from will_paginate plugin, that would be useful too.
I use this for easy pageless pagination. Seems to be a better solution w/o the more button.
http://github.com/jney/jquery.pageless
I've added a Twitter-like 'more' button on the app I'm currently working on. I used the exact method from http://railscasts.com/episodes/114-endless-page.
In this solution, more results are added to the bottom of the div once you scroll down to the bottom of the page resulting in an endless page. I changed the javascript so that it would send off the ajax request to add more results to the bottom of the div only when the 'load more' button is clicked.
The will_paginate project wiki has an entry on Ajax pagination. It's really quite straightforward.
I use Twitter-like pagination in one of my apps, so I'll just point you to that:
http://github.com/tsigo/jugglf/blob/master/lib/twitter_pagination.rb - Hooks into will_paginate to display the "More" button
http://github.com/tsigo/jugglf/blob/master/app/views/members/raids/index.html.haml - The view using the renderer from above
http://github.com/tsigo/jugglf/blob/master/app/views/members/raids/index.js.erb - The RJS view that appends the next set to the page

css highlight current page

I've found some tutorials regarding sprite navigation menu. My problem now when I make it locally, I tried to select each menu and it was not highlighted. Hover is working fine only highlighted selected menu is doesn't work.
here is the link
http://webberzsoft.com/tabmenu/services.htm
Any help would very much appreciated.
Thanks
Tirso
From what I see, all of your pages' <body>s have a "home" id.
For the current page to be highlighted with the CSS rules you're using, you should have corresponding body id's for each page.

Resources