click textbox (to enter characters), when submit is clicked - textbox

If click the submit button or a-element then automatically the input text is clicked.
function send()
{
var txt = document.getElementById("textbox");
txt.click();
}
<input type="text" id="textbox" name="textbox" style="width:90%;">
<a id="send" style="display:none;" onclick="send()" href="">Send</a>

If you want to get the value of "textbox" with the following instruction:
var txt = document.getElementById("textbox");
Then you need to correct it like this:
var txt = document.getElementById("textbox").value;

Related

Get the relative path of the URL and insert in hidden fields

This is an HTML form, which I need to capture the structure of the URL to send to the backend.
I have the example URL:
https://mywebsite.com/en/specialized-areas/agrifood
I would like to separate the URL into:
en
specialized-areas
agrifood
And send each of these URL snippets in a hidden field different from the form:
<input type="text" value="en" class="text">
<input type="text" value="specialized-areas" class="text">
<input type="text" value="agrifood" class="text">
So far I have this script, which takes the parts I need. but I don't know how to insert it into the form fields.
var pathArray = window.location.pathname.split( '/' );
var newPathname = "";
var newPathname = "";
for (i = 3; i < pathArray.length; i++) {
newPathname += pathArray[i] ;
if (i< pathArray.length-1){
newPathname += "/";
}
}
console.log(newPathname);
Can you help me with this script?

Can't route my input parameters to my controller action method

I'm having trouble passing my textbox data to a controllers action parameters.
I'm trying to get the url to look like:
http://localhost:51124/gifts?searchTerm=test
but when I enter in text into the text box I get a url that looks like:
http://localhost:51124/gifts
Here is the code I have for the route:
routes.MapRoute("Gifts",
"gifts",
new { controller = "Gifts", action = "Search" });
here is the code for the page with the text box and button to submit the text box data:
<form method="GET">
<input type="search" name="searchTerm"/>
<input type="button" value="Search By Category" onclick="location.href='#Url.Action("Search", "Gifts")'" />
</form>
here is the code for the controller that I'm trying to pass data to unsuccessfully:
public ActionResult Search(string searchTerm = null)
{
var model = db.Gifts.ToList();
return View(model);
}
"searchTerm" never gets any parameter that I pass into the text box. It's always null.
Create a form element in you view with an input (i.e. the search box) that has a name attribute matching the parameter and a submit button.
#using (Html.BeginForm("Search", "Gifts") {
<input type='text' name='searchTerm' value='' />
<input type='submit' value='search' />
}
This will post back to the Search method in the Gifts controller, passing the vale of the search box to the parameter 'searchTerm'
you have to build this with jquery. add a class to the inputs to use as a selector
<input type="search" name="searchTerm" class="txtSearch" />
<input type="button" value="Search By Category" class="btnSearch" />
then in your script
$('.btnSearch').on('click', function(){
var url = '#Url.Action("Search", "Gifts", new { searchTerm = "----" })'.replace("----", $('.txtSearch').val());
window.location(url);
});

Dart CheckboxInputElement doesn't show text

Dart CheckboxInputElement adds specified text between opening and ending input tags and the browser ignores this text. For example, the following dart code:
FormElement form = new FormElement();
CheckboxInputElement option = new CheckboxInputElement();
option.name = "text1";
option.value = "text1";
option.text = "text1";
form.children.add(option);
window.children.add(form);
creates the following html code:
<form>
<input type="checkbox" name="text1" value"text1">text1</input>
</form>
I end up with checkboxes without descriptors.
You have to add a Label with the descriptor text and link it to the Checkbox:
FormElement form = new FormElement();
CheckboxInputElement option = new CheckboxInputElement();
option.name = "text1";
option.value = "text1";
option.id = "text1";
form.children.add(option);
LabelElement label = new LabelElement();
label.htmlFor = 'text1';
label.text = "This is a checkbox label";
form.children.add(label);
window.children.add(form);
The for property will look for the input with the id specified and connect them (so that clicking on the label text will toggle the checkbox) .
You will end up with the following HTML:
<form>
<input type="checkbox" name="text1" value="text1" id="text1">
<label for="text1">This is a checkbox label</label>
</form>

Display cursor and text both in textbox when page load

I am working on Asp.net MVC.
i am using regular html
<label for="txtbox1" > User Name</label>
<input type="text" id="txtbox1" name="text" class="water"/>
I want to display Cursor before text and Text both when page load. When user start writting in text box at that time "User Name" removed.
You need to use javascript for this. If you are using jquery you could:
$(function() {
$('#txtbox1').focus();
});
And if you want to do this with plain javascript:
window.onload = function() {
var textbox = document.getElementById('txtbox1');
if (textbox != null) {
textbox.focus();
}
};
UPDATE:
If you want the text to disappear when the user starts typing you may try the following:
$('#txtbox1').keypress(function() {
if (!$(this).data('dirty')) {
$(this).val('').data('dirty', true);
}
});
Live demo.

How to re-direct to a page using button in drop down list(options_for_select)

How I can create a drop down list using select_tag "xyz", options_for_select or any way where on selecting any option from down list and hitting button will redirect me.
Any help??
<td>
<%= select_tag "options", options_for_select(
[["Dashboard",
"/homes/"+registrar.enrollment_application.id.to_s
]] ) %>
</td>
<input type="button" value="Select" onclick = "check_options()" >
if above code is right then all i need to write a javascript?? please let me now
function = check_options() {
If you can use javascript or even jquery on the client side you could set the window.location based on the selected item in the drop down, after you click the button:
HTML: This is how you set up your select list and a button
<select id="options">
<option value="http://stackoverflow.com">Stack Overflow</option>
<option value="http://google.com/">Google</option>
</select>
<input type="button" id="optionsbutton" value="Go" />
JavaScript: This is how you wire up the button click to the window redirect
var onButtonClick = function() {
window.location.replace($("#options").val()) //<--- This gets the selected value
// and redirects the window
}
$(document).ready(function(){
$("#optionsbutton").click(onButtonClick); //<--- This hooks up the button click
// to do the onButtonClick function
});
See How to redirect to another webpage in JavaScript/jQuery? for more details.
Update Using Provided Code
You'd just have to make your check_options function find the selected value and set the window location:
var check_options = function() {
window.location.replace($(" [ use selector for select element ] ").val());
});
You should add javascript like this
function check_options() {
window.location = document.getElementById("options").value
}

Resources