I have made an app with jQuery mobile and laravel.
On the first page "mobilepage1" if have a form with a next button.
Also some of the form elements are dropdown menu's. The dropdown select options I get from a table in the database.
In the form on mobilepage1 I have a dropdown list with all department names:
I get this list from my controller like so:
$departmentlist = Company::find($usercompanyid)->departments;
This is how I display the list in the mobilepage1 form:
{{ Form::label('department', 'Department:')}}
<?php
foreach($afdelingslijst as $item) {
$afdelingsarray[$item->afdelingen] = $item->afdelingen;
}
?>
{{Form::select('size',$afdelingsarray)}}
On the second page I want to make a back button.
I tried the jQuery mobile way with a link with: data-rel="back"
But this does not work. I get a page error, it's missing the departmentlist used in mobilepage1. I can make a link to a route to mobilepage1, but I think all the information the user entered in mobilepage1 would be gone.
I see this url in the address bar when I am on mobilepage2 (this is after I filled in the form on mobilepage1 and clicked next).
/public/mobilepage2?size=Personeelszaken&size=32&directechef=Tineke&size=1&size=1&size=1&date-2=&size=1&time=&omschrijving=
Is there a way I can link to the the mobilepage1 route and still keep the information the user entered?
It looks like it would work just by hitting the back button if you passed in the department list with a view composer rather than through a route. Remove it from your route and place this in a file that's being autoloaded...
View::composer('mobilepage2', function($view)
{
$departmentlist = Company::find($usercompanyid)->departments()->lists('afdelingen','afdelingen');
$view->with('departmentlist', $departmentlist);
});
I'm not sure how you are finding $usercompanyid but you should be able to find it within the closure or pass it in by adding use ($usercompanyid) right after the function($view) part.
Also using the lists() function like that will build your array for you so you don't need to worry about the foreach loop in your view.
Since the values are getting passed back and forth as get variables, I think if you use Form::model() instead of Form::open(), it should place all those values back into the input fields for you.
Related
is it somehow possible to add an anchor (or hash) to a Struts 2 Action-URL? To be specific:
I have a html form which can be extended with more fields if the user clicks a button "add more fields". This Button sends a html submit to the backend (Action "thismyaction") where a list object is filled with another set of input fields. The action then returns to a tile "thisismyform" which loads the same jsp as before, where the new fieldset is visible.
(Unfortunately there is no way to achieve that via ajax / JS in this project at the time. I know that you usually add fields that way, but i got the project as it is.)
Each fieldset is counted (fieldset-0, if user adds more fields another set is added "fieldset-1"). The sets always contain the same fields, but enumerated.
What happens here? There is a post to the action which generates another fieldset and redirects back to the same page, where it renders all fieldsets. Important: the result type is "tiles"! I guess this is what makes it difficult.
Now I want to dynamically add an anchor to this URL "thisismyaction.do", like e.g. "thisismyaction.do#fieldset-1". Use Case: User adds another fieldset, post to the action => result type="tiles" => JSP, user sees reload of the page with the new, second fieldset and gets "scrolled" to the second fieldset via the anchor. Is that possible?
I hope I could describe it properly, what I want to achieve... If there are questions, feel free to ask.
Simplest way I can think of right away is
<script type="text/javascript">
window.location.hash = "fieldset-<s:text name="latestIdOfFieldSet" />";
</script>
If you can figure out what's gonna be latestIdOfFieldSet before you render your jsp and set it in your action method. you should get what you are trying to do.
I have a dropdown select on my page called language, which is in a form with other elements. When the form is submitted normally (which submits everything), I can access the value of the dropdown with params[:langauge].
I have another link/button on the page which, when clicked, should get the value of language and pass it to the controller. The controller could then run some ajax to change the language on the page. But how do I pass (just) the value of the dropdown through the link?
Update:
Should I get the value with Jquery, or is there a simpler way?
$('select[name="language"]').val()
If that is a link, the only way to use is query string
that link
You can get "href" of that link by JS, and then use this method to update query string.
Then the method will be able to process with correct params.
If that is a button, that would mean a mini form, you can set a hidden field inside the form and use jQuery to update its value. When sent, the controller method will know this value.
This javascript code should update the URL whenever the dropdown value is changed.
$(function() {
$('#link-button').attr("href", "/link_path/" +$(this).val())
$("select#language").change(function() {
$('#link-button').attr("href", "/link_path/" +$(this).val())
});
});
I am doing a PhoneGap app with JQuery Mobile and I have two pages, one that has a dynamic list of pages and one that has a form to either edit or create a page. These are in a single html file.
Tapping on a list item passes ?action=edit and tapping the "Add" button I have, passes ?action=add querystrings.
Here is a jsfiddle to visualize the pages
NOTE: The example doesn't act quite the same as the live code.
I am running my app on an Android phone and if I do these actions, the correct querysting is observed in the alert box: -
Click the add button on list page
Click back on the form page
Click the an edit list item link on list page
However, if I do it the other why around (click edit first, then the add button) clicking the add button never shows the add querystring in the alert box
(the jsfiddle example always locks the first clicked link's querystring, which is even worse than the live code!)
The problem here is that you're using a multiple template to do this. If you were using this as separate pages, this would work as normal. As a multiple app, the best way to handle this would be to make a link trigger the setting of some global variable that keeps track of the current state of the app.
Make the edit links like this
Page 15
Then make the script something like this:
var editingId = 0
function editPage(id){
editingId = id;
$.mobile.changePage("#editingPage");
});
$("div#editingPage").live("pageshow", function(){
loadDataForPage(editingId);
});
I have an Index method that does double duty as showing a list of posts and a queried list of posts and can also have pages so you get urls like /News/Page/1 or /News?query=test
When a user clicks through to a post at say News/Details/1 they get a simple ActionLink that takes them back to the list. BUT I want this link to take them back to the actual page they were on in terms of the paging or the query. How could I do this? I don't want to use the JavaScript history method. Here is my current ActionLink: <%=Html.ActionLink("<< Back to News List", "Index")%> and this is an example of the paging links: <%= Html.RouteLink("<< First Page", "NewsPaging", new { query = ViewData["query"], page = 0 })%>
Thanks
It would probably be easier to just use javascript to send them back to the last page in their history (without creating a link to the specific page).
history.go(-1)
I will go for a ActionLink like
<%=Html.ActionLink("<< Back to News List", "Index")%>
because user can access News/Details/1 directly and if then you have a link that uses history.go(-1) or history.back() function it will not redirect it to the Index action
Another way to do this is to create the link in the controller and assign it to a property of the model or a simple ViewBag variable (up to you). For this example, I'm just going to use ViewBag.
So in your example, going from /News/Details/1 back to /News/Page/1?some-querystring, you can do the following:
In your controller (assuming '1' is the 'id'):
ViewBag.BackButton = String.Format("/News/Page/{0}{1}", id.ToString(), Request.Url.Query);
In your view:
< Back
One draw back to this is that you must know what the previous page was/could be. In your case, you want your back button to go back to your list, so this technique should be fine.
I'm using ASP.NET MVC 2 for the first time on a project at work and am feeling like a bit of a noob.
I have a page with a customer search control/partial view. The control is a textbox and a button. You enter a customer id into the textbox and hit search. The page then "refreshes" and shows the customer details on the same page. In other words, the customer details appear below the customer search control.
This is so that if the customer isn't the right one, the user can search again without hitting back in the browser. Or, perhaps they mistyped the customer id and need to try again.
I want the URL to look like this:
/Customer/Search/1
Obviously, this follows the default route in the project.
Now, if I type the URL above directly into my browser, it works fine. However, when I then use the search control on that page to search for say customer 2, the page refreshes with the correct customer details but the URL does not change! It stays as
/Customer/Search/1
When I want it to be
/Customer/Search/2
How can I get it to change to the correct URL?
I am only using the default route in Global.asax.
My Search method looks like this:
<AcceptVerbs(HttpVerbs.Get)> _
Function Search(ByVal id As String) As ActionResult
Dim customer As Customer = New CustomerRepository().GetById(id)
Return View("SearchResult", customer)
End Function
A good place to start might be NerdDinner if you havn't already.
In the mean time though The approach I'd use is to have a page that has my search box on it.
Then I'd have a <div> that I name "SearchResults". This will ultimately hold my results to the search.
I then have a PartialView which takes a model that has all the search results and renders them.
So when I click the button I do a call out to a jQuery action that takes the search parameter, performs the search and then returns my PartialView as rendered HTML.
Back in the client side I take that rendered HTML and replace the contents of my div with the HTML.
The keywords to google, or SO, are RenderPartial. This is back end code to render a partial view and give you html.
Also jQuery postbacks so that you can call an action in your controller.
use RedirectToRoute action result
link