I have got below ASP html
<div id="divCheckAll">
<div class="selectall">
<input type="checkbox" id="chkOperationalUpdate" name="chkOperationalUpdate" value="1" />
Operational Update
<div class="clear">
</div>
</div>
<br />
<div class="selectall">
<input type="checkbox" id="chkLounges" name="chkLounges" value="1" />
Lounges
<div class="clear">
</div>
</div>
<br />
<div class="selectall">
<input type="checkbox" id="chkLocations" name="chkLocations" value="1" />
Locations
<div class="clear">
</div>
</div>
<br />
<div class="selectall">
<input type="checkbox" id="chkChauffeurdrive" name="chkChauffeurdrive" value="1" />
Chauffeurdrive
<div class="clear">
</div>
</div>
<br />
<div class="selectall">
<input type="checkbox" id="chkFleet" name="chkFleet" value="1" />
Fleet
</div>
</div>
Now on my button click and form action, I am calling another ASP page which is taking above html values as request. I want to check if any of the above checkbox is not checked then it would return some message back, something like below:
If Request("chkOperationalUpdate")="" or Request("chkLounges")="" or Request("chkLocations")="" or Request("chkChauffeurdrive")="" or Request("chkFleet")="" Then
Response.Write "<font color='red'>Please select at least one items to be published</font>"
Response.End
End If
Above condition works perfectly for checking one request, however I want if user has selected any of the checkboxes then it should not return any message, it should return message only if user missed to select any of the checkboxes.
Please suggest!!
Replace or with and, this way it will display message of selecting atleast one CheckBox if user hasn't selected..
'none of the checkbox is selected
If Request("chkOperationalUpdate")="" and Request("chkLounges")="" and Request("chkLocations")="" and Request("chkChauffeurdrive")="" and Request("chkFleet")="" Then
Response.Write "<font color='red'>Please select at least one items to be published</font>"
Response.End
Else
'User has selected atleast one checkbox
End If
Related
The code below is for a landing page in Marketing Cloud. I have been able to turn the radio button square but when I do they are no longer clickable. Any help would be greatly appreciated.
<div class="radio_heading">
<b> My communication preference is: </b>
</div>
<form action="" method="POST"> hmtl <div class="preference_form form_grid">
<div class="radio_option">
<input type="radio" name="Communication_Preference" value="Email" %%=IIF(#commPreference=="Email" , "checked" , "" )=%% />
<label> Email </label>
</div>
<div class="radio_option">
<input type="radio" name="Communication_Preference" value="SMS/Mobile Messaging" %%=IIF(#commPreference=="SMS/Mobile Messaging" , "checked" , "" )=%% />
<label> SMS/Mobile Messaging </label>
</div>
<div id="sms_disclaimer"> By opting in you consent to receive SMS notifications. Message and data rates apply. You may opt out of SMS messaging at any time by changing your preference on this page or by texting "STOP" to 34313. </div>
<div class="radio_option">
<input type="radio" name="Communication_Preference" value="Direct Mail" %%=IIF(#commPreference=="Direct Mail" , "checked" , "" )=%% />
<label> Printed Mail </label>
</div>
</div>
<input hidden="" name="subkey" value="%%=v(#subscriberkey)=%%" >="">
<div class="update_button">
<button type="submit" onclick="swal.showLoading()"> Update </button>
</div>
I want to make an open "other" field in an HTTP radio form like in the following picture. is it possible? i had in mind something like this:
class="text"><input type="radio" name="sex" id="sex" ="male" checked />male
<input type="radio" name="sex" id="sex" value="female" /> female
<input type="text" name="sex" id="sex" value=(Entered-Value)/>enter other:
A simple demo snippet. It add a change event to the radio buttons and checks the value and based on that shows or hides the textbox.
<div id="radiolist">
<div>
<input type="radio" name="sex" id="sex_1" value="M" />
<label for="sex_1">Male</label>
</div>
<div>
<input type="radio" name="sex" id="sex_2" value="F" />
<label for="sex_2">Female</label>
</div>
<div>
<input type="radio" name="sex" id="sex_3" value="A" />
<label for="sex_3">Apache Helicopter</label>
</div>
<div>
<input type="radio" name="sex" id="sex_4" value="O" />
<label for="sex_4">Other</label>
</div>
<div id="sex_other_container" style="display:none">
<input type="text" name="sex_other" id="sex_other" maxlength="25" />
</div>
</div>
<script>
var $othersex = $('#sex_other_container');
$('#radiolist input[type=radio]').bind('change', function () {
if ($(this).val() === 'O') {
$othersex.show();
} else {
$othersex.hide();
}
});
</script>
It really depends if you want to say hide/show the text box when they select other.
But, then again, they might change their mind, or not even enter anything into that text box - so you start to expand the complexity of the UI.
Sometimes its just better to drop in a radiobuttion list, edit the choices, and then drop in a div next to the rb list, float it, and you are done.
Say, like this:
<div style="float:left">
<asp:RadioButtonList ID="RadioButtonList1" runat="server">
<asp:ListItem>Male</asp:ListItem>
<asp:ListItem>Female</asp:ListItem>
<asp:ListItem >Other</asp:ListItem>
<asp:ListItem>Prefer not to say</asp:ListItem>
</asp:RadioButtonList>
</div>
<div style="float:left;margin-left:-65px;margin-top:1px">
<br />
<br />
<br />
<asp:TextBox ID="txtOther" runat="server" Height="18px" Width="70px"></asp:TextBox><br />
</div>
<div style="clear:both;height:8px"></div>
<asp:Button ID="Button1" runat="server" Text="Button" cssclass="btn"/>
And you get this:
And you code behind say can be this for the button
Protected Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
Dim sChoice As String = RadioButtonList1.SelectedItem.Value
If sChoice = "Other" Then
' get the text enter
sChoice = txtOther.Text
End If
Debug.Print("User choice = " & sChoice)
End Sub
So, keep it simple is often the easy approach here. If 20 things on your page are OH SO having to be customized with JavaScript and all kinds of specials markup, then your project gets in trouble real fast. 10-15 things on a page, each a few minutes of time now becomes say 10-20 minutes of time, and that translates into 100-200 minutes of development time. Then the project and efforts takes way too long to finish.
And if you can try to stick to standard controls, then as above shows, the resulting code behind becomes (and stays) rather simple.
I am working on an MVC5 Web Application , I have a simple registration form containing Email , postcode and password. But when I register the chrome remembers the postcode and password rather than email and password; and next time when I try to enter email the postcodes appear as suggestions.
My markup for the form is as under:
I have edited the question and pasted the whole form. kindly suggest me what to do other than moving email and passwords up or down.
<div class="wrapper">
<div class="closeBetaWrapp">
<div class="simplePopup">
<div class="loginWrapp signupWrapp">
<div class="iconCont"><img src="images/orchaIcon.png" alt="Orcha"></div>
<form action="">
<div class="formrow ">
<div class="leftCol">
<label for="Email">Email</label>
<input class="formField" type="email" name="Email" id="Email" placeholder="Enter your email address here" />
</div>
<div class="leftCol">
<label for="Pcode">Postcode</label>
<input class="formField" type="tel" name="Pcode" id="Pcode" placeholder="Enter postcode here" />
</div>
<div class="leftCol">
<label>Year of Birth</label>
<select id="" class="dropdown">
<option>Choose your year of birth</option>
<option>1980</option>
<option>1981</option>
<option>1982</option>
<option>1983</option>
<option>1984</option>
<option>1985</option>
<option>1986</option>
<option>1987</option>
<option>1988</option>
<option>1989</option>
<option>1990</option>
<option>1991</option>
<option>1992</option>
<option>1993</option>
<option>1994</option>
<option>1995</option>
</select>
</div>
<div class="leftCol">
<label>Gender</label>
<select id="" class="dropdown">
<option>Choose your year of birth</option>
<option>Female</option>
<option>Male</option>
</select>
</div>
<div class="leftCol">
<label for="Password">Password</label>
<input class="formField" type="password" name="Password" id="Password" placeholder="Enter your password here" />
</div>
<div class="rightCol">
<label for="CPassword">Confirm Password</label>
<input class="formField" type="password" name="CPassword" id="CPassword" placeholder="Enter password again" />
</div>
</div><!-- formrow -->
<div class="formrow">
<div class="rightCol btnCol">
<input class="moreBtn" type="submit" value="Signup" />
<input class="moreBtn cnclBtn" type="reset" value="Cancel" />
</div>
</div><!-- formrow -->
</form>
</div>
</div>
</div><!-- closeBetaWrapp -->
Browsers detect passwords by form.elements[n].type == "password" and iterating through all the document. Then it detects the username field by searching backwards through form elements for the text field immediately before the password field.
So, In your case, It thinks your postcode as your username field and remembers this.
So, solution is to move the postcode field above the email field.
If even after moving, it doesn't work, delete previously saved postcode-password value from 'saved passwords' in chrome settings. Also delete any previously saved values by using down arrow key to select the suggestion and pressing shift + delete.
I got the information about how browsers detect username-password field here & here
You can use the autocomplete attribute to tell the browser what the field contains. For example:
<input class="formField" autocomplete="postal-code" type="text" name="PostCode" id="PostCode" placeholder="Enter your postcode here" />
See https://html.spec.whatwg.org/multipage/forms.html#autofill for more information.
I am trying to use an HTML button to link to a new website given a provided text field input.
I have choices like this:
Option: <br />
One <input type="radio" value="Short"
name="option" <br />:
Two <input type="radio" value="Long"
name="option" <br />:
Three <input type="radio" value="Zero"
name="option" <br />:
And I want to have a button go to .../one if One is selected, .../two if Two is selected, etc...
<form> <input class="MyButton" type="button" value="Google"
onclick=window.location.href='www.google.com' /> </form>
I know this is how I go to a specified link, but I want to go to a link based on my option choice, not a static choice. Thanks
Af first you have to fix your HTML Error. No input element has end tag.
Wrap one, two, three with span
Option: <br />
<span>One</span> <input type="radio" value="Short" name="option" /> <br />
<span>Two</span> <input type="radio" value="Long" name="option" /> <br />
<span>Three</span> <input type="radio" value="Zero" name="option" /> <br />
<form> <input class="MyButton" type="button" value="Google" /> </form>
Then you can get your select value and set button onclick value
$(document).ready(function(){
$("input[type='radio']").click(function(){
var text = $(this).prev('span').text();
$('form > input').attr('onclick',
"javascript:window.location.href='https://www.google.com/" + text + "'");
});
});
After that you click on Google button, you will redired to https://www.google.com/yourSelectValue
Use javascript for this.
Make a function call when the button is clicked. something like this...
<input type="button" onclick="myfunction()"/>
and inside the function get the values from text input and use appropriate methods to go to the link.
I personally wouldn't use javascript for this, you can just use a normal button with the URL in the formaction attribute.
<form>
<button formaction="http://stackexchange.com">Stackexchange</button>
</form>
The form tags are required.
Reference: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-formaction
I'm trying to fill in my username and password on a certain web page and then the press the "sign-in" button, all automatically via Powershell.
The problem is that I cannot find the ID of the sign-in button in the html source code.
I have tried to use the command:
$link = $ie.Document.getElementsByTagName('A') | where-object {$_.innerText -match 'sign in'}
but this didn't worked either.
Any thoughts which PS command to use if I want to press the 'sign in' button?
The HTML code is as follows:
<div class="login">
<div class="content">
<div class="subsection-1">Sign in or create a <a id="ctl00_HeaderUserControl_LoginUserControl_hypNewAccount" href="/authentication/registerprovider.aspx?">new account</a></div>
<div class="subsection-2">
<span class="navy bold">What is your email address?</span>
<div class="indent">
<span class="bold">Email:</span>
<input id="loginEmail" class="text-box" type="text" maxlength="100" tabindex="1" />
<img class="ajax-loader" src="/content/images/research/global/transparent.gif" alt="" />
</div>
<div class="invalid-email"></div>
</div>
<div class="subsection-3">
<span class="navy bold">Do you know your password?</span>
<div>
<input id="passwordNotKnown" name="passwordSwitch" type="radio" checked="checked" />
<label for="noPassword">No, I don't know my password or I'm new .</label>
</div>
<div>
<input id="passwordKnown" name="passwordSwitch" type="radio" />
<label for="noPassword">Yes, my password is:</label>
<input id="loginPassword" class="text-box" type="password" maxlength="50" tabindex="2" />
</div>
<div class="invalid-password"></div>
<div class="error"></div>
</div>
<div class="subsection-4">
<button type="button" class="login-button greenButton" tabindex="4">Sign in</button>
Cancel
<input id="stayLoggedIn" type="checkbox" tabindex="3" />
<label for="stayLoggedIn">Stay signed in</label>
</div>
</div>
<div class="reset-password">
<div class="subsection-1">Would you like to reset your password?</div>
<div class="subsection-2">Choosing <span class="bold">yes</span> will reset your password and email a temporary password to: <span class="repeat-email"></span></div>
<div class="subsection-3">
<div class="center">
<button class="reset-password-button" type="button">Yes</button>
<button class="do-not-reset-password-button" type="button">No</button>
</div>
</div>
</div>
</div>
I came here looking for a similar answer and figured out how to get this done. Posting here for any future searchers. As noted by Szymon, getElementsByClassName returns an array, and you will need to select the item you need before the click. In my case the classname was button and I was able to click it using the following:
$submitButton = $doc.documentElement.getElementsByClassName('button') | Select-Object -First 1
$submitButton.click()
This works for me because there is only the one item with the classname button, so your results my vary if you have more than one with the same name. Just change what you grab using select-object if need be.
As #Jamie-Taylor mentioned the login button is in fact a button.
You can access it not only by the id but also by the class name using document.documentElement.getElementsByClassName. Please notice this function will return list of elements as more than one element on page can have the same class.
EDIT
I was wrong: in order to have getElementsByClassName you have to call it on document.documentElement instead of document