Javascript/Django: How to handle simple search in advanced search engine? - javascript

I am working on advance search engine that allow multiple-layered of search(advance search) using Django but I am not sure on how to carry simple search with the search form that contain multiple search fields. E.g: In the form I got a textbox, a dropdownlist that contain several types of fruits and a submit button. The problem is when I decide just to carry a simple search by just simply enter some string into the textbox without choosing the types of fruit and leaving it as the default value " ", when I submitting the form it generated URL: http://127.0.0.1:8000/result/?q=something&fruit_type=+. Is there a way to remove the &fruit_type=+ from the URL?
<form action="/result/" method="get">
<input type="text" id="search_box" name="q"/>
<input type="submit" id="sbm_button" value="SEARCH" class="inputbtn"/>
<br />
<select name="Fruits">
<option value=" ">Fruits</option>
<option value="apple">Apple</option>
<option value="orange">Orange</option>
</select>
</form>
Below is the view.py file:
def search(request):
if 'q' in request.GET:
q = request.GET['q']
fruit_type = request.GET['Fruits']
return render(request, 'result.html', {
'query' : q,
'fruit' : fruit_type,
})
It will return the q and fruit_type to result.html with the generated URL which had mentioned above. Is there a way to ignore the Fruits dropdownlist within the form(submitting the form and ignoring the dropdownlist)? Is it possible to do this in Javascript? Thank you.

Related

open multiple website search queries in background tab from a single form submission

How do I open multiple website search queries in background tab from a single form submission on my website?
Sometimes, when I search for a snippet of code, I just launch up three websites and I think it would be cool to just have a single form automate all the other queries. Just single click a search button and BOOM! 3 background tabs open up with search query.
I would like to merge multiple websites search fields into a single input field submission. Here are the three websites I want to "search":
bootsnip
bootply
codepen
<script>
function dosearch() {
var sf=document.searchform;
var submitto = sf.sengines.options[sf.sengines.selectedIndex].value + escape(sf.searchterms.value);
window.open(submitto);
return false;
}
</script>
<form name="searchform" onSubmit="return dosearch();">
Search:
<select name="sengines">
<option value="https://bootsnipp.com/search?q=" selected>Bootsnip</option>
<option value="https://www.bootply.com/search?kw=modal">Bootply</option>
<option value="https://codepen.io/search/pens?q=modal">codepen</option>
</select>
For:
<input type="text" name="searchterms">
<input type="submit" name="SearchSubmit" value="Search">
</form>
I will use https://cse.google.com/cse in the mean time. Thanks for your attention.

How to extract Data from JSP applete page from watir ruby and nokogiri

I am trying to scrape a form values with ruby , Watir-webdriver and Nokogiri which has some disabled fields.
<input type="text" value="Would be auto populated based on Requirement ID" class="form-control" id="SkillId" disabled="disabled" name="SkillId">
But in the display it shows the value "Java, Oracles,Mysql"
I want to scrap this data i have used the following code
doc.at('input[#name="SkillId"]')['value']
But it extracts "Would be auto populated based on Requirement "
Please help how to extract disabled field Data.
I have tried
doc.at('input[#disabled="disabled"]')
This gives only disabled field values which has real value but what about when value occurs after removing the disable attribute.
I'd use something like:
require 'nokogiri'
doc = Nokogiri::HTML(<<EOT)
<html>
<body>
<form>
<input name="foo">
<input name="bar" disabled>
<button disabled>Foo</button>
</form>
</body>
</html>
EOT
doc.search('[disabled]').map(&:to_html) # => ["<input name=\"bar\" disabled>", "<button disabled>Foo</button>"]
That searches for all tags with a disabled parameter.
doc.search('input[disabled]').map(&:to_html) # => ["<input name=\"bar\" disabled>"]
That searches for only <input> tags with a disabled parameter.
Try this code:
doc.at('input[#disabled="disabled"]')

Django - Change the route of sending a form based on dropdown

I am currently making a kind of internal search engine with multiple options in a dropdown, it works at first but I would like to change the form to get the urls based on the dropdown, so I can get:
example.com/search/**Option_Value_Here**/?q=my+query
I'm using Django as the framework
<form action="/search/" method="get">
<input name="q" id="query" value="{{ query }}" type="text" autocomplete="off">
<select id="category" name="select-name" method="get">
<option value="Jose">Jose</option>
<option value="Mike">Mike</option>
<option value="Mary_Ann">Mary Ann</option>
<option value="chaplin">Chaplin</option>
</select>
<input value="Search" class="fit" type="submit">
</form>
My question is if there is a way where I can change the path of the form action:
<form action="/search/{{ Option_Value_Here }}}/" method="get">
Thanks for your time.
Regards
You can do that with JavaScript/jQuery.
<form id="myform">
...
</form>
$(".category").change(function(){
value = $(this).val()
$('.myform').attr('action', "/search/" + value)
});
Remember to place the code in a $(document).ready() listener.
Want to avoid JavaScript?
You can get the value directly in the template. You cannot change that value if the user changes the dropdown value: in this case, your only chance is that of redirecting the user in your views.py based on what he choose in the dropdown.
Remember: Django simply renders a page and sends it to the user. Whatever happens before a new call is made to your server is not in the possibilities of Django but those of JavaScript.

How to navigate to other php pages using drop down list?

I am having trouble trying to figure out how to navigate to different web pages using a drop down list and submit. I have three forms:
main.php
two.php
three.php
In my main.php page I have a drop down list consisting of only two options 'second' and 'third'. How can I use these two options to navigate to other php pages? For example, if I selected the option 'two' and click submit, the page should then take me to the second.php page. And if I select option 'three', I will be taken to the third.php page.
Also, once I am directed to one of the php pages, how can I then be able to go back to the 'main.php' page if I decide to go to the other php page instead? (I thought perhaps the use of a back button).
Below is part of my 'main.php' page:
<label>Select the page you wish to go:</label></td>
<select name="pages"/>
<option value="two.php">Second</option>
<option value="three.php">Third</option>
</select></td>
On <select></select> value change :
HTML :
<select name="pages" onChange="my_function(this)">
JavaScript :
function my_function(element){
document.location.href = element.value
}
Example
On <button></button> click :
HTML :
<button onClick="my_function()"></button>
JavaScript :
function my_function(){
document.location.href = document.querySelector('select[name="pages"]').value
}
Example
You can do multiple things. If you dont wan't to rely on javascript, make the form submit to a file like router.php.
inside router.php put:
<?php
if (isset($_POST['pages']) {
header('Location: ' . $_POST['pages']);
}
Which will effectively forward the request to the page you submitted in the select.
You also have to change your html a bit:
<label>Select the page you wish to go:</label></td>
<form method="post" action="router.php">
<select name="pages"/>
<option value="two.php">Second</option>
<option value="three.php">Third</option>
</select>
<input type="submit" value="go there" />
</form>
If you are fine with javascript go with #notulysses's answer, its way easier and quicker.
Using POST values directly in a header method is kinda nasty imo.
Jquery solution
HTML CODE:
<form id="frm" method="post" action="" >
<label>Select the page you wish to go:</label>
<select name="pages"/>
<option value="two.php">Second</option>
<option value="three.php">Third</option>
</select>
<input type="submit" name="sub" value="Finish" />
</form>
JQUERY CODE
$('#frm').on('submit',function () {
var nextPage= $('select option:selected').val();
$(this).attr('action',nextPage);
return true;
});
Happy Coding :)

Getting data that was posted from form

I have a simple drop down box inside a form. When a search button is clicked the value that was selected in the box is posted. I need to get the value that is posted, back and put it in a variable so I can add that field to a DTO and then run a database search based on what the field was. I want to use jquery to post and get the data back but unsure how to do this so Im just using plaing javascript for the post.
Javascript:
<form name="values" method="POST" action="MainPage.jsp">
<tr>
<td>
<select name="searchDropDown" id="searchDropDown">
<option value="Volleyball">Volleyball</option>
<option value="Basketball">Basketball</option>
<option value="Hockey">Hockey</option>
<option value="Soccer">Soccer</option>
</select>
<input type="submit" value="Search Video">
</td>
</tr>
</form>
Jquery:
<script>
$(document).ready(function() {
SportsDTO dto = new SportsDTO();
SportsDAO dao = new SportsDAO();
var searchValue = $('#searchDropDown').val();
dto.setSport(searchValue);
dao.findBySport(dto.getSport);
});
</script>
I know the DAO and DTO work because I have a junit test written that passes
Just need to get the value back so I can run the database search and return the values into a table.

Categories