|
HTML - Image Map Select A Checkbox?
This question is a little out there. Hopefully someone might have a creative strategy.
I'm trying to make different areas in an image map select different check boxes next to the image on the page. Is there any possible way to do this using HTML, javascript, anything? Any help would be appreciated. Similar TutorialsHello all, I have a stong question because i can't solve it. I want to creat a drop down list with images beside each row. Usualy on clasic html is something like this: select ... option value /option /select But i want a small image (icon) beside each option from select. See for example: http://www.scrigroup.com/afaceri/con...ate/index7.php on the top page see a clasic select. How can i change it to icon seclect on each option? Thanks for your effort to reply How to make a image rollover based menu that changes image on mouse rollover and on mouse click so when I click the image it stays changed until I click on another image in the menu. Dear All, I find that I can do that in firefox, ie 9, but not ie 8 and ie 7. anyone knows the answer. HTML Code: <select id="resourceTypeTree" name="resourceTypeTree">
<script type="text/javascript">obj158= new Object;obj158.sid = 158;obj158.seq = 1;obj158.lv = 1;obj158.lvText = "首頁";obj158.upLvSid = 1;obj158.isShown = 1;obj158.isNetvigated = 1;obj158.url = "/cle/landingPage.php";obj158.remarks = "";obj158.lastUpdate = "2011-04-18 16:15:50";obj158.uiNextSeq = 0;obj158.nextSid = 160;</script>
<option value="158" onclick=selectClick('tree',obj158); >→首頁</option>
<script type="text/javascript">obj3= new Object;obj3.sid = 3;obj3.seq = 2;obj3.lv = 1;obj3.lvText = "語文學習基礎知識";obj3.upLvSid = 1;obj3.isShown = 1;obj3.isNetvigated = 0;obj3.url = "/cle/pages/webSiteReferenceList.php?sid=3&upLvSid=1";obj3.remarks = "";obj3.lastUpdate = "2011-04-18 16:28:05";obj3.uiNextSeq = 7;obj3.nextSid = 160;</script>
<option value="3" onclick=selectClick('tree',obj3); >→語文學習基礎知識</option>
<script type="text/javascript">obj10= new Object;obj10.sid = 10;obj10.seq = 1;obj10.lv = 2;obj10.lvText = "漢字形音義";obj10.upLvSid = 3;obj10.isShown = 1;obj10.isNetvigated = 0;obj10.url = "/cle/pages/webSiteReferenceList.php?sid=10&upLvSid=3";obj10.remarks = "";obj10.lastUpdate = "2011-03-16 13:46:44";obj10.uiNextSeq = 10;obj10.nextSid = 160;</script>
<option value="10" onclick=selectClick('tree',obj10); >→→漢字形音義</option>
<script type="text/javascript">obj38= new Object;obj38.sid = 38;obj38.seq = 1;obj38.lv = 3;obj38.lvText = "漢字的演變";obj38.upLvSid = 10;obj38.isShown = 1;obj38.isNetvigated = 1;obj38.url = "/cle/pages/webSiteReferenceList.php?sid=38&upLvSid=10";obj38.remarks = "";obj38.lastUpdate = "2011-03-16 14:25:54";obj38.uiNextSeq = 0;obj38.nextSid = 160;</script>
<option value="38" onclick=selectClick('tree',obj38); >→→→漢字的演變</option>
<script type="text/javascript">obj39= new Object;obj39.sid = 39;obj39.seq = 2;obj39.lv = 3;obj39.lvText = "字形的正體、俗體、異體";obj39.upLvSid = 10;obj39.isShown = 1;obj39.isNetvigated = 1;obj39.url = "/cle/pages/webSiteReferenceList.php?sid=39&upLvSid=10";obj39.remarks = "";obj39.lastUpdate = "2011-03-16 14:25:54";obj39.uiNextSeq = 0;obj39.nextSid = 160;</script>
<option value="39" onclick=selectClick('tree',obj39); >→→→字形的正體、俗體、異體</option>
</select>
Regards, Man Pak Hong, Dave manpakhong@hotmail.com hi , Iam using checkbox in program in html. when i clicked the checkbox iam geeting required content , but i want to hide the content when i removed the selection on my checkbox.even if i remove the selection content is available , but i want to hide it. if there is any option to do that please sugest me. thanks regards jyothi. html than php in second post. I cant figre out the code for the checkboxes to get there value. HTML Code: <form name="form2" action="captcha3.php","http://www.mark-10.com/cgi-bin/mailto" method="POST" onsubmit="return ErrorCheck();">
<INPUT TYPE="hidden" NAME="RECIPIENT" VALUE="dm@mark-10.com">
<INPUT TYPE="hidden" NAME="subject" VALUE="Mark-10 Warranty Registration Form">
<INPUT TYPE="hidden" NAME="THANKURL" VALUE="http://www.mark-10.com/thankyou-warranty.html">
<input type="hidden" name="identicalfields" value="email,email2">
<tr>
<td align="left" width="627" height="16" colspan="4"><font size="2">1. How did
you first become aware of Mark-10 products?</font></td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4">
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%">
<tr>
<td><input type="checkbox" name="aware[]" value="Internet"><font size="2">Internet</font></td><td width="75%" colspan="3">
<input type="checkbox" name="aware[]" value="Magazine"><font size="2"> Magazine</font><input name="magazine" type="text" size="36"></td></tr>
<tr><td><input type="checkbox" name="aware[]" value="Colleague"><font size="2"> Colleague</font></td>
<td><input type="checkbox" name="aware[]" value="Exhibition"><font size="2"> Exhibition</font></td>
<td><input type="checkbox" name="aware[]" value="Distributor"><font size="2"> Distributor</font></td>
<td><input type="checkbox" name="aware[]" value="Mailing"><font size="2"> Mark-10 mailing</font></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4"></td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4"><font size="2">2. Which
search engine(s) do you most commonly use when searching for equipment? Check up
to two choices.</font></td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4">
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%">
<tr>
<td width="25%"><input type="checkbox" name="Q2Google" value="Yes"><font size="2">
Google</font></td>
<td width="25%"><input type="checkbox" name="Q2Yahoo" value="Yes"><font size="2">
Yahoo</font></td>
<td width="25%"><input type="checkbox" name="Q2MSN" value="Yes"><font size="2">
MSN Search</font></td>
<td width="25%"><input type="checkbox" name="Q2Ask" value="Yes"><font size="2">
Ask</font></td>
</tr>
<tr>
<td width="25%"><input type="checkbox" name="Q2GS" value="Yes"><font size="2">
Globalspec</font></td>
<td width="25%"><input type="checkbox" name="Q2TR" value="Yes"><font size="2">
Thomas Register</font></td>
<td width="50%" colspan="2">
<input type="checkbox" name="Q2Other" value="Yes"><font size="2"> Other
</font><input name="Q2OtherName" type="text" size="30"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4"></td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4"><font size="2">3. Which of
the following best describes the primary reason for purchasing this Mark-10
product? Check all that apply.</font></td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4">
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%">
<tr>
<td width="25%"><input type="checkbox" name="Q3Size" value="Yes"><font size="2">
Size</font></td>
<td width="25%"><input type="checkbox" name="Q3Price" value="Yes"><font size="2">
Price</font></td>
<td width="25%"><input type="checkbox" name="Q3Reputation" value="Yes"><font size="2">
Brand reputation</font></td>
<td width="25%"><input type="checkbox" name="Q3Warranty" value="Yes"><font size="2">
Warranty</font></td>
</tr>
<tr>
<td width="25%"><input type="checkbox" name="Q3Features" value="Yes"><font size="2">
Features</font></td>
<td width="50%" colspan="2">
<input type="checkbox" name="Q3Versatility" value="Yes"><font size="2"> Versatility
/ Modularity</font></td>
<td width="25%"><input type="checkbox" name="Q3Recommendation" value="Yes"><font size="2">
Recommendation</font></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4"></td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4"><font size="2">4. How would
you rate the service you received from Mark-10 or your distributor?</font></td>
</tr>
<tr>
<td align="left" width="627" height="16" colspan="4">
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%">
<tr>
<td width="25%"><input type="checkbox" name="Q4Poor" value="Yes"><font size="2">
Poor</font></td>
<td width="25%"><input type="checkbox" name="Q4Satisfactory" value="Yes"><font size="2">
Satisfactory</font></td>
<td width="25%"><input type="checkbox" name="Q4Good" value="Yes"><font size="2">
Good</font></td>
<td width="25%"><input type="checkbox" name="Q4Outstanding" value="Yes"><font size="2">
Outstanding</font></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="right" width="627" height="16" colspan="4"></td>
</tr>
<tr>
<td align="right" width="627" height="5" colspan="4">
<p align="left">5. Please suggest any improvements to existing Mark-10 products
or new product ideas.</td>
</tr>
<tr>
<td align="right" width="627" height="16" colspan="4">
<p align="left">
<textarea name="Q5Improvements" style="width:425px; height: 75px;" rows="1" cols="20"></textarea></td>
</tr>
<tr>
<td height="16" colspan="4"></span>*Please Enter Code-><img src="captcha_image.php" alt="" />:
</div>
<input name="Security_Code1" type="text" id="Security_Code1" size="15"></td>
</tr>
<tr>
<td align="right" width="627" height="16" colspan="4">
<p align="left"><input name="submit" type="submit" id="scratch_submit" onClick="MM_validateForm('Name','','R','Email','','RisEmail','Address1','','R','City','','R','State','','R','Zip','','R','Tel','','R','ModelNo','','R','SerialNo','','R','PurchDate','','R');return document.MM_returnValue" value="Submit">
<input type="reset" value="Clear" name="Reset"></td>
</tr>
</table>
<table cellspacing="2" width=525 border=0 celpadding="3">
</table>
</form></td>
HTML Code:
<input type="hidden" value="0" name="options[age]"/><input type="checkbox" value="1" name="options[age]">
<xsl:if test="match_result/form_definition/form_values/value[@name = 'options[age]'] = 1">
<xsl:attribute name="checked">checked</xsl:attribute>
</xsl:if>
</input> Age
<input type="hidden" value="0" name="options[already_matched]"/><input type="checkbox" value="1" name="options[already_matched]">
<xsl:if test="match_result/form_definition/form_values/value[@name = 'options[already_matched]'] = 1">
<xsl:attribute name="checked">checked</xsl:attribute>
</xsl:if>
</input> Include already matched partners
I have two checkbox in XLS, but the second is uncheck, while the first one is checked. what is going on? FYI: i did not write these codes How do you creat an unchecked checkbox in ZLS? Hi all! I wanna know how to personalise a checkbox... replacing the check off/on with an image (off and on). Can't find the script anywhere There's one for the radio button, but not for the checkbox Thanx Ray Hi there, Can anyone tell me the easiest way to make a form that only allows up to three checkboxes to be ticked? I've got a form with a question that asks 'which three of the following do you agree most with.' and there's about 10 checkboxes. How easy is it to limit the number to three? Many thanks! Hi Guys, I've got 90 checkboxes in a table in a form on my index.html page. i.e: Code: <input type="checkbox" name="2e" id="2e"/> I would like one checkbox to be initially checked depending on the url used to get there e.g. Code: http://mysite.com/book/index?2e or http://mysite.com/book/index?2e=yes Any Ideas? Thanks, Leigh Hello, I am having troubles getting the below to work. Can someone help me out? Thanks in advanced. How do i get the below to work? Java if (document.orderform.terms.value== false) { alert("You must agree to our terms and conditions before an order can be processed") document.orderform.terms.focus() return false } HTML: <p>By clicking on the below you have read and agree to our terms and conditions</p> <input type="checkbox" name="terms" /><p>I Agree</p> I have a simple HTML page that I would like to have 2 checkboxes available for the user to click. Now where this gets a little different: I do not want to have this "form" to function as a normal form, as this webpage is generated and displayed from within a desktop application (as a template). I essentially just want the user to click a checkbox and then click the print button from within the desktop application and have the webpage print with the checkbox checked. I am running into a problem because the checkbox that the user checked clears out when the user clicks the print button. I am assuming this is because I do not have any sort of "submit" method being used for this form (as it is just essentially a display for the user to check off an option that should then be printed as displayed on the screen). Is this at all possible? I am restricted to using HTML, CSS and XSL to build these web templates that are displayed in the desktop application so asp, javascript etc is not an option. Thanks for any help. I have a page that has a checkbox. The checkbox is initially checked/unchecked depending on a value in a table. (Of course, the user has the ability to change this value once the page loads, this is just used for the initial value). The following code works, but does not validate using XHTML 1.0 STRICT: Code: <input type = 'checkbox' Name="chkComplete <?PHP print $chkComplete; ?> >Would you like to mark the item as completed? I know to validate to XHTML strict, I would need to code as either checked="checked" or unchecked="unchecked". How can I incorporate this into the PHP print or echo command so that the line will validate? Thanks. Hi: I would like to have a checkbox select input where I have approx 24 items for the user to select from. However, I want the user to *priority-order* his selections and have him/her select only a max of 8 of the 24 items. Instead of a 'checkmark, I would like to see the digits '1' up to '8' in the check boxes, which would indicate his priority order of choices. If this is impossible, can you suggest an alternative. (I don't want a drop-down list, I would prefer a 6-row, 4-column table of checkbox inputs). btw, this will be used by service providers to tell us which services they can/will provide to our Senior's Park, and in what priority they rate their various capabilities (from tree-pruning thru painting, thru yard cleanup, thru plumbling, re-modelling, etc). Thanks, -Mel Smith So, just have to say upfront that I don't really know HTML at all but my boss likes to throw me into things and lets me sink or swim. Basically, I need to update a database viewer that he wrote. The first (of sure to be many) problems are check boxes. Currently, when the user chooses a database and table from a drop down box then it shows the table with all the rows and columns showing. Note that the columns change based on the table selected. Now, I need the page to display a list of all the columns in that table as check boxes and when one clicks on a check box, it filters the table to show only the checked columns. I currently have the correct check boxes showing up based on the table but I am having trouble retrieving which columns have been checked for use in the actual filtering. Here's my current version of relevant code: HTML Code: <form name ="columnList">
Column: <c:forEach var="columnitem" items="${columns}">
<c:if test="${columnitem.name != this.document.columnList.name}">
<input type="checkbox" name="${columnitem.name}" id="${columnitem.name}" value="${columnitem.name}">${columnitem.name} </input>
</c:if>
</c:forEach>
<th> <a href="onclick=javascript:setColumnsSelected('<c:out value='${columnitem.name}'/>')" </a> </th>
</form>
Code: function setColumnsSelected(column){
var colList = new Array();
if(this.document.getElementById(column).checked == true)
colList.add(column);
else
colList.remove(column);
}
colList isn't used yet, but it will be. Can anyone help me out? Be gentle, I really have no clue what I'm doing. My form includes two checkboxes: Code: Remember password? <input type="checkbox" name="rememberPassword" value="on" checked/> <b><i><font color="#35A02C"> (deselect if using a public computer)</font></i></b><br/> Automatic login? <input type="checkbox" name="autoLogin" value="on" checked/><br/> How can I make it so that if the user deselects the first checkbox, the second will be automatically deselected aswell? Thanks, James Hi Guys, The form below is part of a new ticketing system i am playing around with. I dont know much about it yet but i want to add a mandatory checkbox to the form and also a text area which contains my terms and conditions. The form below is part of submitting a new ticket and before they can do so i want them to have to check the box below my terms and conditions saying they have read and agree. I'm no expert on forms but im guessing this could be acheived by adding a text area and a checkbox. Most important thing >>>> If the checkbox is not checked i want a pop up warning to pop up saying please tick the box or something like that. Heres the form anyway: Code: <form name="new_ticket" method="post" action="new_ticket.php" onSubmit="return validate_ticket(document.new_ticket);" enctype="multipart/form-data" >
<input type="hidden" name="act" value="openticket">
<div class="sub-heading">
{{cClient_newtickettitle}}
</div>
<div class="formheading">
<span class="label">
{{cLogin_direct}}
</span>
</div>
<div class="formrow">
<span class="label">{{cClient_fullname}}:</span>
<span class="field"><input name="client_name" type="text" class="singleline-field" id="full_name" value="{{client_name}}" />
<span class="mandatory-fld">
*
</span>
</span>
</div>
<div class="formrow">
<span class=label>
{{cClient_phone}} :
</span>
<span class="field">
<input type="text" name="phone" value="{{phone}}" class="singleline-field">
</span>
</div>
<div class="formrow">
<span class="label">
{{cClient_email}} :
</span>
<span class="field">
<input type="text" name="email" value="{{email}}" class="singleline-field">
<span class="mandatory-fld">
*
</span>
</span>
</div>
<{customfields_loopstart}>
<div class="formrow">
<span class="label">
<{field_name}> :
</span>
<span class="field">
<{draw_field}>
</span>
</div>
<{customfields_loopend}>
<div class="formrow">
<span class=label>
{{cDepartment}} :
</span>
<span class="field">
<select name="dept_id" class="singleline-field">
<option value="">{{cSelect}}</option>
<{dept_loopstart}>
<option value="<{dept_id}>" <{selected}> ><{dept_name}></option>
<{dept_loopend}>
</select>
<span class="mandatory-fld">
*
</span>
</span>
</div>
<div class="formrow">
<span class=label>
{{cTicket_priority}} :
</span>
<span class="field">
<select name="priority_id" class="singleline-field">
<option value="">{{cSelect}}</option>
<{priority_loopstart}>
<option value="<{priority_id}>" <{selected}> ><{priority_name}></option>
<{priority_loopend}>
</select>
<span class="mandatory-fld">
*
</span>
</span>
</div>
<div class="formrow">
<span class=label>
{{cTicket_subject}} :
</span>
<span class="field">
<input type="text" name="subject" value="{{subject}}" class="textarea-field">
<span class="mandatory-fld">
*
</span>
</span>
</div>
<div class="formrow">
<span class=label>
{{cTicket_message}} :
</span>
<span class="field">
<textarea name="message" cols="{{cols}}" rows="{{rows}}" class="textarea-field" id="comments">{{message}}</textarea>
<span class="mandatory-fld">
*
</span>
</span>
</div>
<{attachment_start}>
<div class="formrow">
<span class=label>
{{cTicket_attachment}} :
</span>
<span class="field">
<input type="file" name="attachment" value="" size="50" /> ({{cMax}} {{attachment_size}} {{cKb}})
</span>
</div>
<{attachment_end}>
<div class="formheading">
<span class="label">
{{cProvide_password}}
</span>
</div>
<div class="formrow">
<span class="label">
{{cPassword}} :
</span>
<span class="field">
<input type="password" name="pass_word" class="singleline-field">
<span class="mandatory-fld">
*
</span>
</span>
</div>
<div class="formrow">
<span class="label">
{{cPassword_confirm}} :
</span>
<span class="field">
<input type="password" name="password_confirm" class="singleline-field">
<span class="mandatory-fld">
*
</span>
</span>
</div>
<div class="formrow">
<span class="field">
<input type="submit" name="Submit" value="{{cSubmit}}" class="stdbutton-field" />
<input type="reset" name="reset" value="{{cReset}}" class="stdbutton-field" />
</span>
</div>
</form>
I also have a number of other forms i will want to add this feature too so if anyone edits the code please highlight the part you added for me to see easily and then i can just copy it to my otehr forms. Thanks in advance CC_DESIGN In my imaginary web page, I have a list of products. I also have a list of questions with (Yes) and (No) checkboxes beside them. If (No) is checked for question 1, the text for product 2 and 3 must change to grey instead of black. Etc. How could I do this? i want to create a checkbox which is checked initially, and users cannot discheck it. I mean this checkbox is checked all the time, no matter user click it or not. Please help me. Thank u! I've tried a few different things and I honestly don't know how to get it to work. I'm using MS VWD Express in hopes it would take care of most of the work. I really hope someone can give me an example of what I'm looking to do. Just to keep it simple I'll keep it to two columns. SQL Database Column 1 ID (int) primary key Column 2 Name (varchar) On my aspx page I would like to have checkboxes and to keep the example short let us just say three. Mike John Frank What I'm look for is if Mike and John are checked I will get a datagrid with results like the following: ID Name 2 Mike 4 Mike 9 Frank 10 Frank or if all three are checked I would get ID Name 1 John 2 Mike 3 John 4 Mike 5 John 6 John 7 John 8 John 9 Frank 10 Frank I just can't figure it out. Please help. Thanks. i'm an idiot novice and i have a set of checkboxes i want to display... <table> <tr> <td> <input name="1" type="checkbox" value="1" />PROVISIONAL<br/> <input name="2" type="checkbox" value="2" />COMPLETE<br/> <input name="3" type="checkbox" value="3" />PARTIAL<br/> <input name="4" type="checkbox" value="4" />FINAL<br/> <input name="5" type="checkbox" value="5" />PROGRESS<br/> <input name="6" type="checkbox" value="6" />ADVANCE </td> </tr> </table> however, when it displays on the page...they are staggered like this... one two three etc. i can add another break after each checkbox but that puts too much space between each checkbox....is there anything i can do? thanks in advance! |
|||||||