Sending data to script from hyperlink - html

is there any way I can do something like in my example below but with normal hyperlinks ? I can't use drop down menu.
//edit: I have a web page and a script, on web page now i have drop down menu where user choose some values and submit them, script then do the work.
I just need to sent 3 values to script. (user must choose this values)
Hope its clearly now
this is part of code on my page:
<form action='script/script.py' method='post'>
<select name = 'menu0'>
<option value='x'>X</option>
<option value='y'>Y</option>
//
And also is there any easy way to remember what user set in dropdown menu ?

First, you can't use POST method in hyperlink, if your server code support GET method then you can create separate links for multiple options
x data
y data
....
.....
Other solution: This should also helpful you, as above create multiple links, you can hidden your form and submit form from <a> tag onclick event

With Hyperlink you can use GET method which is more easy to embed in the link like this :
X
Y
So make this work, you will be needing to change your script.py code, that make use of GET function instead of POST.
And easy way to remember what user set in dropdown menu is to store the input you GET via your script to a session variable when script.py gets executed. You can then use that session variable in whole scope of your application i.e. any other python scripts. Refer Session variables for this.

Related

Dropdown select with delete option next to each option value

I need to implement a drop-down which has a delete 'X' option next to each option item. Somewhat like the image shown below.
The drop-down is populated dynamically and I need a way that does not inlvolve using list as an alternative.
EDIT: The icons next to each dropdown item refers to 'Edit'/'Delete'
You cannot put a checkbox into the usual <select> or multi-select HTML element.
However, here is another question where several good options are discussed.
This looks like the most useful and best suited to your purpose:
https://stackoverflow.com/a/27547021/1447509
And here is an example of how to change the default checkmark to an X:
https://stackoverflow.com/a/40123793/1447509
Sources:
How to use Checkbox inside Select Option
After selecting check box Instead of Tick symbol need X in html
UPDATE:
Given that you need both the HTML markup and the javascript to make it do what you want, you have two (possibly 3) steps to do:
This answer provides a good example of how to create the custom-rolled <select> control.
This answer shows you how to replace the checkbox created in step 1 with an icon/image of your choosing.
The javascript to remove the x'd <option> is very simple:
$(this).closest('option').remove();
IF you also need to save these results, then you also need to learn:
4a. Server-side SESSIONS (so that each user's customizations are saved for them)
4b. A login system, so you know for which user to save the current customizations.
4c. Just the basics of how to use a back-end database, such as MySQL/MariaDB, in which to store the user customizations.
4d. AJAX - so you can schlep info to the back-end for insertion into the database without refreshing (or navigating away from) the current page. AJAX replaces the ancient and no-longer-used <form> construct. Frankly, once you've used AJAX a couple of times, you'll never go back. Totally easy.
If you are in a bind and need someone to create the whole thing for you, I refer you to one of these websites - I have used such services myself and can recommend them.

onclick pass variables to ajax

AI have an expanding box, which contains some information, what I want to do and not sure if it is possible is that when somebody clicks on the link (shown below)
View Job Description
it passes a variable to Ajax and then have that update a mysql table to say the job description has been viewed.
Now I know the link above is just a link which triggers some javascript to expand the box and so just after some advice on how I can achieve this?.
I have other code which passes variables to ajax but through a form, and so I am not sure if this is possible.
Try this one using Jquery:
after the clicking the link the ajax request will be sent to the specified url.
ulr i.e. where your script will excute.
store all result in variable and print at the end of page.
Usins variable "data" you can get that result.
$(".expandLink").click(function(){
$.post("url",function(data,status){
$(div).html(data);
}
});

Send all options from a select list to another JSP

I currently have a JSP with a select that looks like this:
<select name="withoutAccess" size="5">
<c:foreach var="item" items="${obj.withoutAccess}">
<option>${item}</option>
</c:foreach>
</select>
For the sake of clarity, I'll only post the select list, as the rest works well.
Now, in my form, when I click the submit button, I want to catch all values in the select list in the other page.
I'm only managing to obtain the option that is selected in that list when I press the button.
How can I obtain the rest?
I've tried with request.getParameterValues("withoutAccess"), but it has only 1 option, the one that is selected.
Only the selected options ever get sent in a form post. If you want to get the entire list of options, you need to look them up again (i.e., from the database), or store them in a persistent storage location such as session or application state.
Well, I found one solution.
Create a javascript script that puts all options with selected = true, that way I can catch them in the request :)

Auto Refresh of a page

I have a web page consisting of a dropdown menu. What i want is the contents of other dropdown menus present in the page must change according to what has been selected in the first dropdown box. For example if a dropdown consists of Degree as its element. If i select Degree element then another dropdown must show only degree courses. This must happen automatically without clicking any button. How can i achieve this?
I would make this a comment, but I do not have commenting abilities. You are going to want to use $.post with jquery and ajax to accomplish this: http://api.jquery.com/jQuery.post/ . Ajax with JQuery is not difficult to do.
You will want to use the onchange event of the first drop down to use a jquery ajax $.post call to post to the server, passing the selection from the drop down as a parameter. The page that it post's to should us GET to get the selected attribute from the drop down, and then retrieve ( from the database or where ever) the options that go into the second drop down, based on the parameter. The code should be written out to the page. The jquery ajax call has a way to get the response and let you define a custom function to be run once the post returns. The return should be what you had written out to the page, and then you can just update the second drop down list with the returned data inside this function.
I hope this helps!

How to Load the page First and read database

HTML form has some text boxes and a drop down box.
Drop down has huge values, and takes lot of time to fetch from database.
So I want to load the page first and while the user fills the form (text boxes) I want to load the drop down box (without his knowledge :-) ).
But without any event trigger, how do I make call to database again ?
I am using JSF with RichFaces, Servlet.
The following code is not working
<h:selectOneMenu value="#{obj.selectedValue}">
<f:selectItems value="#{obj.allValues}" />
<a4j:support selfRendered="true" action="#{bean.action}"/>
</h:selectOneMenu>
Thanks,
+1 for using Ajax - but if you have a very large number of values,t hen you might want to consider using an auto completion dropdown - where the the user starts typing what they need and after they have typed a few characters, you kick off your ajax reqeuest and just load those requests that match.
have a look at "google suggest" if you want to see this in action
-Ace
As already mentioned you can use AJAX to load the dropdown items asynchronously, but I would suggest redesigning the form so that the huge dropdown is not required. Perhaps let the user search for the correct value on a previous or subsequent screen? Long dropdowns are not easy to use as they require lots of scrolling and it can be hard to find the correct value on a large list.
At the bottom of your page put the following:
<a4j:jsFunction name="yourJsFunction" action="#{bean.fetchSelectItems}"
reRender="yourDropdown" />
window.onload = yourJsFunction();
You will have to use AJAX. When the page loads display a empty select box. Then write some JavaScript that will call some URL on your server that will return the options for the select box. And when you get that just populate the select box with those values.
Be advised that your form will be useless to those without JavaScript.