Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I am using the Uniform Plugin to Style Checkbox and Radio Buttons.
I am able to get the styling working but on click the selection is not happening. Since this doesnt require me to activate the styling manually JS it should work.
Demo
Here is your problem:
You pre-formatted your HTMl like uniformwould do it by itself.
And then you did not call uniform() to add its event-listeners.
So you just need pure HTMl-input tags.
instead of
<div class="checker"><span class="checked"><input type="checkbox" checked="checked" class="styled"></span></div>
You should write:
<input type="checkbox" checked="checked" />
JavaScript:
Finally you need to put something like this in your JS section, to get uniform working, and change the radio-class:
$( document ).ready( function () {
$("select, input, a.button, button").uniform({radioClass: 'choice'});
});
Your HTML is not pre-formatted, your radio-buttons still work with uniform and finally uniform works as intended
Working Example
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
I am working on online shopping website like flipkart and want to forward values through request or say just want to append value to URL, But I have not used form so, I can not use form action. For instance consider following situation.
value1<input type="number" min="1" name="value1">
value1
value2<input type="number" min="1" name="value2">
value2
value3<input type="number" min="1" name="value3">
value3
I have three input text associated with three hyper link and if I hit any link then value in respective text-box should appended to URL and we go to next page.
In this case somePage.jsp?Value=2 something like this....
HTML
<a id="reflectedlink" href="http://www.google.com/search">http://www.google.com/search</a>
I will show you with an example, here on keyup event i am dynamically changing href value.
JAVASCRIPT
<script type="text/javascript">
var link= document.getElementById('reflectedlink');
var input= document.getElementById('searchterm');
input.onchange=input.onkeyup= function() {
link.search= '?q='+encodeURIComponent(input.value);
link.firstChild.data= link.href;
};
Check the same in https://jsfiddle.net/aadi/pr5j9Lbv/
You can change the content of the href attribute via JavaScript, as described here.
thanks André I have got my mistake. the problem is solved by your solution, But I have made mistake is I am given same name for all the links....
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I have two image-type buttons on my page:
<input type="image" src="logg.png" name="saveForm" class="btTxt submit" id="saveForm" />
<input type="image" src="logg.png" name="saveForm1" class="btTxt submit" id="saveForm1" />
The problem is that the buttons' image doesn't load up. When I get rid of one of the buttons, though, everything is fine. The buttons have different names and IDs, what's the problem?
You're missing the ALT values. These are needed incase the image can't be loaded:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input
Here's an alternative approach:
Create two <buttons> or <input type="submit"> and style their backgrounds using css.
If your goal is to submit the png image in the form, there's a similar answer here: <button> background image
Check if the image source location is valid and the image is available in the location where the browser is searching for.
Check that by right clicking on the image button, use option Inspect element(available only in higher versions of browsers) and check for the source location for the image.
In ur case the image should be available on the same folder where the html is available.
Check for typo errors.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I want to create a dynamic form on my website.
On my site a have several forms that are subject specific but i also have a contact us form with a subject dropdown from which they can choose any of the subjects that the subject specific forms cover.
now if they select website design enquiry i need to ask them for their website address whereas website address isn't relevant to all of the other enquiry subjects, if they ask about website hosting i again need their website address but also need their preference of hosting package.
if they ask about mobile app development i don't need the website or hosting package fields but need 4 checkboxes to appear to allow them to tick the ones relating to the platforms for which the mobile app is to be developed for.
so it needs to be auto adaptive to the type of enquiry selected.
how can i acheive this?
you can use jQuery, to achieve that.
you need to add jQuery change listener on the dropdown select. then you add form elements to a container accroding to selected value.
here is a small example
$( ".select" ).change(function() {
var value = this.val();
if(value == "webDesign")
{
$("#fieldsContainer").append('<input name="webUrl" class="inputField"/>');
}
});
you can also change action url accroding to select Value so it will be more easy to handle different forms
if(value == "webDesign")
{
$("form#myForm").attr('action','process.php?type=webdesign');
}
Your question is quite vague, but the answer to it is that there are many ways to achieve it. One of the most commonly used ways is to use javascript (or some library like jQuery using js).
I have put together a basic function for you that will showcase how it's done in pure js:
HTML:
Services: <select id="service">
<option value="stuff">stuff</option>
<option value="webdesign">webdesign</option>
</select><br />
<span id="webname">Website: <input type="text" /></span>
JS:
document.getElementById("service").onchange = function () {
if (document.getElementById("service").options[document.getElementById("service").selectedIndex].value == "webdesign")
document.getElementById("webname").style.display = "none";
else
document.getElementById("webname").style.display = "block";
}
Here is the demo page of the above code: http://jsfiddle.net/w3pGr/
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 8 years ago.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Improve this question
I am trying to make a HTML page list members of a list from a database, I have made the connections already but when using a dropdown to select the name of the list using an onclick, I would like it to display the list members below. I have tried to incorporate an onclick function but it keeps linking to another page when I want it to still stay on the same page but list the members.
<script type="text/javascript">
function changeFunc()
{
var selectBox = document.getElementById("nameoflist");
var selectedValue = selectBox.options[selectBox.selectedIndex].value;
alert(selectedValue);
} </script>
<select name="nameoflist" onchange="changeFunc();">
<option value="" disabled="disabled" selected="selected">Select Recipients</option>
<option value="All Recipients">All Recipients</option>
<option value="Tech List">TechList</option></select>
Look forward to your help!
CP
Save a couple lines, pass in this in your inline handler, and use that in your func:
function changeFunc(obj)
{
var selectedValue = obj.options[obj.selectedIndex].value;
alert(selectedValue);
}
<select name="nameoflist" onchange="changeFunc(this);">
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
I have a contact form with two submit buttons (the buttons both have the same function, apart from one is higher up the page)
Both buttons have validation on them (if a checkbox is not ticked a warning pops up)
IF the submit button that is higher up the page is clicked and the validation not complete, I would like the page to jump to the bottom.
I have tried wrapping the input button with an anchor tag:
t<input type="image" src="http://fc01.deviantart.net/fs71/f/2010/108/c/5/Green_Submit_Button_by_rukiaxichigo15.jpg" onclick="if(!this.form.checkbox.checked){alert('Please read and agree to the terms and conditions first.');return false}" />
and put the anchor code at the bottom of the document:
<a name="seccta"> </a>
... but it doesn't work. It works when I put text in place, but a submit button breaks it.
Instead of wraping the button, put it before or after the button
t<input type="image" src="http://fc01.deviantart.net/fs71/f/2010/108/c/5/Green_Submit_Button_by_rukiaxichigo15.jpg" onclick="if(!this.form.checkbox.checked){alert('Please read and agree to the terms and conditions first.');return false}" />
For the user, it wont make any change, since you will be pointing righ after/before the button. If you need to put a blank character use
Try it
Ok, I added another onclick to the anchor and that has solved my problem:
location.href='#seccta'; if(!this.form.checkbox.checked){alert('Please read and agree to the terms and conditions first.');return false};