About onSubmit and how I should use it - javascript

So I am trying to create four select menus within a form that give the user several item options/combinations.
So basically they can chose different values from all four select menus and onSubmit the user will be taken to the correct URL. Example (Agra -- Blue/Aqua -- Traditional -- $99-$199) and the url for that filter will direct the user.
The question I have is how should I go about defining a function for something like this?
I essentially need the form (we already have the URLS for every combo) to direct the user to the appropriate url when they click submit. Part of me thinks this is a very inefficient way of doing things and that I should be using jQuery or something.
Any help is appreciated

When using the drop down option each listing contains a value. depending on what values you set you could create a filter to locate the correct URL.
Also depending on ur URLS you could create them with the values of the drop down menu.
You might want to consider adding a search button so u know when the user has selected all of the options.

Related

Reload partial and retain form values

When purchasing a course, the user can enter 1 or more students to register for the course. By default there is only one entry but the user can use a dropdown to select more and then the form will update to show more.
I am accomplishing this by triggering an event when the user changes the dropdown value that uses ajax to call an action which returns a partial with the appropriate number of entries and then I just replace the existing div with the new one.
My question is whether there is a way to implement this so that it's kind of like "refreshing" the page where the form remembers and automatically refills in he values the user already entered just like if you were to refresh the entire webpage. Is there a way to do this, or will I need to pass in the existing values into the action in my ajax call and have the partial set them?
A secondary question I just thought of (and perhaps this should be in another post but I will go ahead and put it here for now) is whether I should be concerned about any weird behavior with validation when doing it this way? (I'm using stock, built in validation with annotations).

Modify Field In On Instance In LiveCycle

I'm working in LiveCycle creating a form that allows the user to duplicate a sub form as they need. In that set of fields there is a dropdown and if it is set to certain values a field that is normally hidden should display. I only want this to display in that instance of the sub form that they made that selection. So my question is how do I determine which instance fired off the event? If I get that I think I can go from there with making the change.
I'm still new to LiveCycle and the resources out there are scattered at best. Any help is appreciated.
PS I'm using Javascript and not FormCalc.
the easiest way is to use built-in functionality that helps you to address proper objects in your code. When you are typing your code in the script window, just hold Ctrl and mouse click the object you want to refer your code to. It will generate a correct short version DOM name for that object. If you hold Ctrl-Shift and then click, you'll get a full DOM address for that object.
For example, you have a 1-page form that has a subform, which can get multiple instances. Inside that subform you have a drop-down "Selector" which controls visibility of the text field called "Weight". Your DOM addresses will look like follows
form1.page1.subform.Selector - this is your drop-down
form1.page1.subform.Weight - this is your text field
Now because your script is located inside of the object in the same subform that has also the object you want to control, you don't even need to pay attention of any instance numbers.
In your script window of form1.page1.subform.Selector just type
if (this.rawValue == "Yes"){
Weight.presence = "visible";
}
It will address only the object that is located in the same subform with your drop-down controller.

BigCommerce: How to create custom filter?

I want to allow for checkbox-filtering, such that when a particular checkbox is 'checked', the page will only show the items corresponding to that checkbox property.
Example) I want only products that are 'new', so I check the box for new products.
How can I create this kind of a filter in BigCommerce? I have tried the url-api filter, granted I didnt expect it to do much, but I have at least tried it.
I am hoping for some way to 'hide' all other products if they dont fall under that checkbox's property.
You can write some javascript to do this for you, but the main thing you'd need here is to somehow differentiate between product types.
Example: what designates a product as 'new' vs 'old'?
I would be happy to help you write this script to react to the users interaction with checkboxes, but we need some HTMl here for the products themselves in order to have our javascript recognize them.
Can you update your question with some HTML examples of the products or items you want to hide/show based on user interaction with a checkbox selector?

Save sort order to hidden field with sortable jQuery plugin

I am using this plugin (http://farhadi.ir/projects/html5sortable/) to create a feature for a website where a user can add form fields on the fly.
The idea is that they will give the form a name (title), and then add a series for form fields. These form fields need to be drag and drop sortable (thus the plugin) so the user can rearrange the order.
Once they are satisfied with the order, they will click the "Create Form" button, and the data to create the form will be submitted.
The data itself will be stored in three tables. Table 1: Forms, Table 2: Fields, and Table 3: Forms_Has_fields. The Forms_Has_fields table will includes a sort_order column, which tells the system in what order to display the fields.
That's where this question is important: when a field is re-sorted using the drag and drop feature, I need a way to save the sort order in an or some other form control so I can parse it with PHP and create the fields properly.
If this was in PHP, I would just keep everything in an associative array: ($fieldname => $sortorder), but that doesn't seem like it's an option in javascript. Ideally, I could keep this in an array in Javascript, and then when sumit was clicked, dump that array as a JSON to an field, and POST it to PHP. But if that's possible, I don't know how to do it.
If there is another (more elegant) way to handle this, I am open to suggestions.
Turns out, I was making it more complicated than it needed to be. I am giving you the points because you answered my question; however I did find a more elegant way of doing it. The is, in fact, the order and array already. There is no reason to create a separate array to manage what is being saved in what order because the does it already. All you have to do is itterate through it with .each().
And, best of all, I didn't have to use global variables

Sort and retrieve data with drop down menus in php

I have two drop down menus on my webpage. One is a course list and the other is a student list. What I want to do is, when a selection is made in the course menu it will update the student menu to only list students in that course.
All the course and student data is saved in a MySQL database. The SQL statements to retrieve the results I want are not a problem. I have those figured out. The problem is that I don't know how to get one drop down menu to update the other without the use of a submit button. Is there a way to have the course menu call a php function when it changes, and that will update the student menu?
I've looked through several similar questions, but a lot of them end up resetting the first menu when the second is updated. I need to print both the selected course and student on the page at the end.
Is this something that can be done with PHP, or would Javascript be more preferable? If someone could point em in the right direction, that would be much appreciated.
Is there a way to have the course menu call a php function when it changes, and that will update the student menu?
Yes. The buzz-word for this is AJAX.
You will end up using both JavaScript and PHP to do this. The actual implementation is quite involved, so I will list the basic steps for you.
(JavaScript) Bind the change event for the course drop down menu.
(JavaScript) When that event is fired, capture the selected course and fire an XMLHttpRequest off to your server along with the selected course.
(PHP) Capture the selected course, and run the SQL statement to fetch your students.
(PHP) Convert the student list to a text format (JSON, XML, delimited-text, etc.) to send back to the browser (using echo, print, etc).
(JavaScript) Populate the student drop down menu.
The general approach to this is to use jQuery to add a hook to your drop-down selector and trigger an AJAX load on another section of the page, populating that with data retrieved either as an HTML fragment (easy) or JSON data that's turned into one (harder).
A really quick and dirty version is to grab a portion of a page and re-populate the current document with it using $.load():
$('#select1').on('change', function() {
$('#select2').load('select.php #select2', 'select1=' + $(this).val())
})
That's the rough idea: When your first selection box changes, load the select.php page, or whatever you're using, and add on the parameter select=N where N is the selected value. It then rips out the #select2 section and replaces it.

Categories

Resources