HTML - input & select to URL - url

I would like my clients to add in there URL, plus select from a drop down to complete the URL, going to a new page on clicking a button.
<form name="form1" method="post" action="">
<label>http://www.
<input type="text" name="input1" id="input1" value="mydomain.com">
</label>
/
<select name="select" id="select">
<option value="Select" selected>Select</option>
<option value="cPanel">cPanel</option>
<option value="Webmail">Webmail</option>
</select>
<label>
<input type="submit" name="button1" id="button1" value="Submit">
</label>
</form>
What must still be added to the above simple html code, (which is just the format), so my clients just need to add there domain, select an option from the drop down and click submit to take them to there respective login screen. The link will be typically:
http://example.com/cpanel or http://example.com/webmail

I received this fine answer from Chris on Yahoo Answers, thought I would share the answer.
http://jsfiddle.net/khrismuc/gwM9K/
<form onsubmit="return go(this.where.value, this.which.value)">
http://
<input type="text" name="where" id="input1" value="www.mydomain.com" />/
<select name="which" id="select">
<option value="Select">Select</option>
<option value="cPanel">cPanel</option>
<option value="Webmail">Webmail</option>
</select>
<input type="submit" name="button1" id="button1" value="Submit" />
</form>
// https://answers.yahoo.com/question/index?qid=20140327005411AAk9zW1
// form -> go to url
var go = function(where, which) {
if (which === "Select") return false;
// change option to url part
if (which === "cPanel") which = "cpanel";
if (which === "Webmail") which = "webmail";
document.location.href = "http://" + where + "/" + which;
return false;
};

Related

SOLVED - Select2 attr "selected" stop working when set false

The goal is to select users according to the option chosen in the first select.
It works fine the first time you select that type of user. But when I change the user type and go back to the previous one, it doesn't show the options in the select. But through the inspect element it appears that the option has the "selected" attribute
<label for="UserType" class="col-md-2 control-label">User Type nbsp;<span class="text-danger small">*</span></label> <div class="col-md-4">
<select class="select2_demo_1 form-control" id="UserType" name="UserType">
<option value='0' selected disabled hidden>-- Selecionar --</option>
<option value="1">Boss</option>
<option value="2">Admin</option>
<option value="3">User</option>
</select>
<label for="Users" class="col-md-2 control-label">Users <span class="text-danger small">*</span></label><div class="col-md-10">
<select id="Users" name="Users" class="select2_demo_1 form-control" multiple style="width:100%">
<option data-type='1' value="1" >User Boss</option>
<option data-type='2' value="2" >User Admin</option>
<option data-type='2' value="3" >User Admin 2</option>
<option data-type='3' value="4" >User</option>
</select>
$('#UserType').on('change', function() {
var UserType = $(this).val();
$("select#Users option:selected").attr("selected",false);
$("select#Users option[data-type="+ UserType +"]").attr("selected","selected");
$("#Users").select2();
});
$('#UserType').trigger('change');
------ Solution ------
Change the code segment
$("select#Users option:selected").attr("selected",false);
$("select#Users option[data-type="+ UserType +"]").attr("selected","selected");
$("#Users").select2();
by the following
$('#UserType').select2('destroy').find('option').prop('selected', false).end().select2();
$('#UserType').select2('destroy').find('option[data-type='+ UserType+']').prop('selected', 'selected').end().select2();
You may think to add selected="true" and then change it to false when you apply the function attr()

Rails mechanize gem - scraping

I want to fill in some options which trigger the downloading of a file, using the Mechanize gem.
The HTML is the following.
<div>
<form action="" id="label_selectors" method="post">
...
...
<div class="source form_options">
<select name="source" id="source">
<option value="btce" selected="selected">Btc-e</option>
<option value="cryptsy">Cryptsy</option>
<option value="796">796</option>
<option value="bitstamp">Bitstamp</option>
<option value="formulas">Altcoin Indexes</option>
</select>
</div>
<div class="label form_options">
<select name="label" id="label">
</select>
</div>
<div class="period form_options">
<select name="period" id="period">
<option value="15m">15 minute</option>
<option value="1h" selected="selected">1 hour</option>
<option value="1d">1 day</option>
</select>
</div>
<div class="presense form_options">
CSV: <input type="radio" name="presence" value="csv"> Chart: <input type="radio" name="presence" value="chart" checked="checked">
</div>
<div class="submit form_options">
<input type="submit" name="submit" value="OK">
</div>
</form>
</div>
I tried to do something like this:
form = page.forms.first
form.source = "btce"
form.label = "BTC/USD"
form.period = "1d"
form.presense = "csv"
form.submit
However, it doesn't work:
NoMethodError: undefined method `presense=' for #<Mechanize::Form:0x007fb878dc7f98
(the typo presense rather than presence appears in the page)
How could I fill in this form correctly?
It looks like the presence input is a radio button.
To select a radio button with mechanize you'll want something like:
form.radiobuttons_with(name: 'presence')[0].check
There's other ways to select radio buttons with mechanize - you can see them here: http://docs.seattlerb.org/mechanize/GUIDE_rdoc.html

load dynamic values in form elements in jquerymobile

I have one page called index.html.I need to load some values at the time of showing page via jquery mobileevent .
Text and text area values added well.But the filpbox is not updating.Can anyone please to solve this ?
inxedx.html filp box coding
<label for="group_name" class="ui-hidden-accessible"></label>
<input type="text" name="group_name" id="group_name" placeholder="Enter Group Name" />
<label for="group_desc" class="ui-hidden-accessible"></label>
<textarea name="group_desc" id="group_desc" placeholder="Enter Group Decription"></textarea>
<label for="group_published">Published</label>
<select name="group_published" id="group_published" data-role="slider" data-theme="b">
<option value="1" >Yes</option>
<option value="0" >No</option>
</select>
test.js
$('#pg_add-group').on('pageshow', function(event) {
$('input[id=group_name]').val('hello');
$('textarea[id=group_desc]').val('hello desc');
$('select[id=group_published]').selected = false;
$( ".input[id=group_name]" ).textinput( "refresh" );
$( ".textarea[id=group_desc]" ).textinput( "refresh" );
});
You forgot to enhance look of select box, it is done like this:
$('select[id=group_published]').selectmenu('refresh', true);
Read more about it here.
Update:
I didn't look carefully so I didn't so your question was about flipswitch slider.
Working example: http://jsfiddle.net/Gajotres/vds2U/75/
HTML:
<label for="flip-1">Flip switch:</label>
<select name="flip-1" id="flip-1" data-role="slider" data-default-value="off">
<option value="off" defaultSelected>Off</option>
<option value="on">On</option>
</select>
JavaScript:
$(document).on('pagebeforeshow', '#index', function(){
$(document).on('click', '#reset', function(){
$("#flip-1").val('off').slider('refresh');
});
});

Rails use picklist in query-ui modal

I'm using query-ui - Dialog - Basic Modal to make a pop-up form for Fullcalender events. It works great. But, I would like to add a picklist as one of the input fields in the modal.
The following works as a test:
<div id="dialog-form" style="display: none" title="Create new event">
<form>
<fieldset>
<label for="workorder">Workorder</label>
<select name="workorder">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
</select>
<label for="title">Title</label>
<input type="text" name="title" id="title" class="text ui-widget-content ui-corner-all" />
<label for="description">Description</label>
<input type="text" name="description" id="description" value="" class="text ui-widget-content ui-corner-all" />
<label for="hours">Hours (All Day ONLY)</label>
<input type="floating" name="hours" id="hours" value="" class="text ui-widget-content ui-corner-all" />
</fieldset>
</form>
</div>
The modal displays the select values as options - good so far.
Now I would like to populate the options with data from my workorder table.
How would I do that?
Thanks!!
Figured it out =
<%= collection_select(:workorder, :id, Workorder.all, :id, :wonum) %>

DropDownList automatically closes in Firefox

I have several forms in ASP.Net MVC.
I noticed that some of the dropdowns close automatically in FireFox, but not in IE.
I don't have any Javascript or JQuery with triggered actions on any of these dropdowns.
Any ideas on why this is happening?
<form action="Index" id="MyID" method="get"><label>
Search <input id="searchWord" name="searchWord" type="text" value="" />
Category <select id="CategoryID" name="CategoryID"><option value="">-- Select All --</option>
<option value="1">Item A</option>
<option value="2">Item B</option>
<option value="3">Item C</option>
<option value="4">Item D</option>
<option value="5">Item E</option>
</select>
</label>
<label>
<input class="button" value="Search" type="submit" />
</label>
</form>
The dropdown list is coded using Razor as:
#Html.DropDownList("CategoryID", "-- Select All --")
The <label> tag defines a label. You have wrong close tag for <label>.

Resources