I have an html page that takes form input. Based on the form variables input into the form, I want to navigate to different URLs using AngularJS routing. Can anyone provide some information as to how I can do this?
There can be multiple approaches to this. Two obvious choices are to use $routeProvider if you are using ngRoute for routing or $stateProvider if you use angular-ui-router. In both cases, the paradigm remains the same.
Essentially you can map your form date from $scope to the states/routes in your app.config. From there, you can pass the templateURLs and map them to whatever HTML page you want it to load.
Please reach out for further clarification . All the best.
Related
I'm pretty new to Razor Pages, and I'm trying to figure out how to replicate routing I have in my current Angular Page.
I have a base razor page that will be populated with different data depending on which parameter is passed to it. This is easy enough, and I know how to do this. However, my problem is in the routing because I want to be able to pass a readable parameter that is based off of the base URL. For example, I want to be able to do:
https://myURL/Band1
https://myURL/Band2
and have both point to the same page (but not the Index Page), consume the parameter "Band1" or "Band2" to display the associated information.
I understand how to consume the parameter, and how to get data, what I'm not clear on is how to do this routing based on the base URL. I can see how I'd do it if it were https://myURL/b/Band1 since I'd make a "b" page and accept parameters.
But how does one do this without that intervening segment of the URL? I need to be able to do this to not break existing links.
Thanks!
The docs for Razor Pages suggest you can create a page named Index.cshtml, which will act as the default where no page is specified in the URL.
Edit
If you want to preserve the parameterless index page, but have your page take its place when the additional URL part is provided, try the following in your page:
#page "/{bandName}"
I am volunteering on a website-based project that is trying to make all pages fully operable JavaScript free before adding any JavaScript for enhancements, and I was asked to investigate whether or not a particular scenario could be handled purely through HTML/CSS.
What we have is a form that is populated to help us filter a list of tickets that are displayed on the screen after a page update through a GET action, which itself works fine, but the concern with the current implementation is that the URL cannot be made into a permanent link. The request, however, to keep the permanent link as minimal as possible, is to only send GET parameters for fields that are populated with something (so, suppressing GET parameters for fields that are blank) instead of having a different GET parameter for each form field on the page.
I have thought of several ways that could be done, most including JavaScript (example: create fields with ids but no names and a hidden field w/ name that uses JS to grab the data from the fields), but also one that would be a POST action with a redirect back to the GET with a human readable string that could be permanently used. The lead dev, however would prefer not to go through the POST/redirect method if at all possible.
That being said, I'm trying to make sure I cover all my bases and ask experts their thoughts on this before I strongly push for the POST/redirect solution: Is there a way using only HTML & CSS to directly suppress GET parameters of a form for fields that are blank without using a POST/redirect?
No, suppressing fields from being submitted in an HTML form with method of "GET" is not possible without using JavaScript, or instead submitting the form with a POST method and using a server side function to minimize the form.
What fields are submitted are defined by the HTML specification and HTML and CSS alone cannot modify this behavior and still have the browser be compliant with the standards.
No, you cannot programmatically suppress any default browser behavior without using some kind of client scripting language, like JavaScript.
As a side note, you say "JavaScript for enhancements", but JavaScript is not used for enhancements these days. And no one in the real world would except a decent front-end without the use of JavaScript. I would suggest you simply use JavaScript.
I do not think you can avoid Javascript here to pre process before submission to eliminate unchanged /empty form fields.
i doing some shopping cart ui in html.
I would like to avoid nested form but any solution which allow me to route request to two different handler is preferable with the data included. There are two requests are delete item and check out.
I wonder what is the alternative solution to nested form.
Please help.
Thanks.
You can't have nested forms in HTML, so you have to use an alternative.
The form that you post doesn't have to be located where the information that you want to post is located. You can use Javascript to copy the information from some fields in the page into hidden fields inside a form somewhere else on the page, and post that form.
This will also make the page simpler. You can use a single form for the delete function, instead of having one form for each item.
I am trying to simply post an entire form w/o the need to create the url like you would have to in a get call. All of the tutorials I have seen for this for some reason create a parameter URL and send it via the send ability.
I want to be able to send a form via the form id or form name, is this possible?
The reason is because I will have some submits that can have anywhere from 2 to 1000 checkboxes the user can press (not my choice).
Example I looked at mainly is: http://www.captain.at/howto-ajax-form-post-request.php
I use a type="button" to do the submit not a onchange or anything like that.
Use jQuery, and it's very easy:
$.post("/myactionpage.php",$("#formID").serialize(), function (data) { whatever(); });
If you can use jQuery, the JQuery Form plugin does exactly that.
The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX. The main methods, ajaxForm and ajaxSubmit, gather information from the form element to determine how to manage the submit process.
There are multiple ways to do this and you're right, you don't want to use the GET method. You want to use the POST method, which allows you to send all the data in the form. There are too many options to list, but jQuery is a good start. If you don't want to use an external library like jQuery, try checking out a google search on "ajax via post".
In Django / Pinax, I've come across the login form which starts like this :
<form class="login" method="POST" action="">
It works perfectly well. So I assume that either some java-script or something in the Django framework is putting the value into the action attribute.
So, my questions:
How does Django insert the action?
Why do they do it like this?
How can I find out what the action of this form is?
Update : I see this is not a Django thing at all, but what most browsers do.
Having an action of an empty string in most browsers points the form at the URL the browser currently has loaded, which is the script that served the form in the first place.
For an interesting insight on forms with empty actions read this thread, which gives you an updated HTML5-perspective on this matter.
It's also possible that javascript loaded with this page could be setting an action once the page is loaded based on what application is using the page.
Another likely possibility is that the javascript is handling the onsubmit event. One might do that to prevent the page from reloading or redirecting to a specific page
I guess it's bit late to answer this post. Anyways, I'll what I learnt about this.
If the "action" is not specified in forms, then the Django looks up the HttpResponseRedirect in the corresponding view.
For example, in the example below:
if form.is_valid(): # All validation rules pass
# Process the data in form.cleaned_data
# ...
return HttpResponseRedirect('/thanks/')
Once, the form is validated (and processed), the page is redirected to 'thanks'