Chrome Extension - google-chrome

I want to make extension that add field between these two [UserID]
then edit the script file on the website [ or overwrite it ] so after clicking search i will get search result by userids
i`m learning but i know the basics
i dont need full code
just code which select the place on the website
<table class="dt" cellspacing="1">
<tbody><tr>
<td class="dth">Calloff Number</td>
<td class="dtc1">
<input class="ipt" type="text" name="calloff_no" value="">
</td>
</tr>
<tr>
<td class="dth">Dates</td>
<td class="dtc1">
From
<input class="ipt" type="text" name="datefrom" value="">
to
<input class="ipt" type="text" name="dateto" value="">
</td>
</tr>
<tr>
<td class="dth">Company</td>
<td class="dtc1">
<input class="ipt" type="text" name="company" value="">
</td>
</tr>
<tr>
<td class="dth">Account</td>
<td class="dtc1">
<input class="ipt" type="text" name="account" value="">
</td>
</tr>
<tr>
<td class="dth">Calloff Status</td>
<td class="dtc1">
<div><input type="checkbox" class="ipt" id="status_" 0"="" name="status" checked="checked" value="0"><label for="status_0">Pending</label></div><div><input type="checkbox" class="ipt" id="status_" 1"="" name="status" value="1"><label for="status_1">Picking in progress</label></div><div><input type="checkbox" class="ipt" id="status_" 2"="" name="status" value="2"><label for="status_2">Part shipped</label></div><div><input type="checkbox" class="ipt" id="status_" 3"="" name="status" value="3"><label for="status_3">Complete</label></div>
</td>
</tr>
</tbody></table>
https://i.stack.imgur.com/O8LiO.png

Related

Why can't NVDA find the label name of date and number?

I'd like to add label on my website using Thymeleaf fields, too.
I wrote the following code:
<form id="newFoo" action="#" th:action="#{'/save'}" th:object="${foo}"
method="post" autocomplete="off">
<table>
<tr>
<td> <label for="name" form="newFoo">Name</label></td>
<td>
<input id="name" type="text" th:field="*{name}" required="required">
</td>
</tr>
<tr>
<td> <label for="gender" form="newFoo">Gender</label> </td>
<td>
<select id="gender" th:field="*{gender}" required="required">
<option th:each="g : ${genders}"
th:value="${g.id}" th:text="${g.name}" ></option>
</select>
</td>
</tr>
<tr>
<td> <label for="birthday" form="newFoo">Birthday</label></td>
<td>
<input id="birthday" type="date" th:field="*{birthday}" min="1900-01-01" max="2100-01-01" required="required">
</td>
</tr>
<tr>
<td><label for="height" form="newFoo">Height</label></td>
<td> <input id="height" type="number" th:field="*{height}" required="required"> </td>
</tr>
<tr>
<td colspan="2">
<button type="submit">Submit</button>
</td>
</tr>
</table>
</form>
When I tried to navigate through my form by NVDA, only the labels of texts and select were shown and said. Numbers and date were not shown. I tried it on Google Chrome and on Firefox.
Trying w3school, number worked, too.
How can I solve it?

Fieldgroup inside of a table form

<fieldset style="width: 400px;">
<legend><h2>Form Validation</h2></legend>
<form>
<table>
<tr>
<td>Name:</td>
<td><input type="text" name="ime"></td>
</tr>
<tr>
<td>Username</TD>
<td><input type="text" name="username"></td>
</tr>
</table>
<input type="submit" value="Submit" name="send">
</form>
</fieldset>
I am currently making a form inside of a table... This is kind of new for me, since I don't know how to do it. Above is the code I have tried, and I need something like this.
If someone could get me on the right path, ill be really grateful.
Note: As you can see in the picture above, it needs to have colspan of 3, so they can all have equal width. I made a perfect one with just <form>, but i just found out we have to do it inside of a table...
The easiest way to do it is colgroup - there you can specify, how much of space of the table any column should take.
For your example it would be something like this: (plz note that I didn't feel all of needed rows)
<fieldset style="width: 400px;">
<legend><h2>Form Validation</h2></legend>
<form>
<table>
<colgroup>
<col width="40%"/>
<col width="60%"/>
</colgroup>
<tr>
<td>Name:</td>
<td><input type="text" name="ime"></td>
</tr>
<tr>
<td>Username:</td>
<td><input type="text" name="username"></td>
</tr>
<tr>
<td>Password:</td>
<td><input type="text" name="username"></td>
</tr>
<tr>
<td>Re-type password:</td>
<td><input type="text" name="username"></td>
</tr>
<tr>
<td>Gender:</td>
<td>
<input type="radio" id="male" name="gender" />
<label for="male">Male</label>
<input type="radio" id="female" name="gender" />
<label for="female">Female</label>
<input type="radio" id="other" name="gender" />
<label for="other">Other</label>
</td>
</tr>
<tr>
<td>Programming skills:</td>
<td>
<input type="checkbox" id="java"/>
<label for="java">Java</label>
<input type="checkbox" id="ruby"/>
<label for="ruby">Ruby</label>
<input type="checkbox" id="net"/>
<label for="net">.Net</label>
</td>
</tr>
</table>
<input type="submit" value="Submit" name="send">
</form>
</fieldset>

why my table frozen column

Sorry, this is my jsfiddle.net link >> http://jsfiddle.net/2vw1035n/
Why my column keep frozen at right side ?
This is my table
#table {
margin-left: 260px;
border: none;
font-size: 14pt;
font-weight: bold;
font-family: 'bookman old style';
}
<form>
<div class="regisContent">
<table id='regisTable'>
<tr>
<td>
<label for="fname">Name</label>
</td>
<td>:</td>
<td>
<input type="text" name="fname" id="fname" placeholder="Input your name here.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="passw">Password</label>
</td>
<td>:</td>
<td>
<input type="password" name="passw" id="passw" placeholder="Input your password here.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="cnpass">Confirm Password</label>
</td>
<td>:</td>
<td>
<input type="password" name="cnpass" id="cnpass" placeholder="Please input your password again.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="email">Email</label>
</td>
<td>:</td>
<td>
<input type="text" name="email" id="email" placeholder="Input your email here.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="phone">Phone</label>
</td>
<td>:</td>
<td>
<input type="phone" name="phone" id="phone" placeholder="Input your telephone number here.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="gender">Gender</label>
</td>
<td>:</td>
<td>
<input type="radio" name="gender" id="male" value="male"> Male
<input type="radio" name="gender" id="female" value="female"> Female
</td>
</tr>
<tr>
<td>
<label for="address">Address :</label><br/>
<textarea rows="7" cols="57" name="address" id="address" placeholder="Input your address here.."></textarea>
</td>
</tr>
<tr>
<td>
<fieldset id =box>
<legend>Terms & Conditions:</legend>
<pre id=terms>
Welcome to our website. If you continue to browse and use this website,
you are agreeing to comply with and be bound by the our terms
and conditions of use, which together with our privacy policy govern Baggy
Bag Shop relationship with you in relation to this website.
</pre>
</fieldset>
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="agreement" id="ck" value="agreement">
<label for="ck" class='textConf'>I agree with the terms and conditions stated above</label>
</td>
</tr>
<tr>
<td>
<input type="submit" value="Submit"onclick="validate()"/>
<input type="reset" value="Cancel"/>
<!--<input type="button" value="Poke" onmouseover="this.style.background='white'" onmouseout="this.style.background='gray'" />-->
</td>
</tr>
</table>
</div>
</form>
I can not post any images here since i got no reputation ..
i switched up your table format a little and applied a max-width onto the td's with the label. demo here: http://jsfiddle.net/2vw1035n/2/
<tr>
<td>
<label for="fname">Name</label>:
</td>
<td>
<input type="text" name="fname" id="fname" placeholder="Input your name here.." id='textConf'/>
</td>
</tr>
css:
tr>td:nth-child(1) {
max-width:100px;
}
hope this helps

radio button doesn't show the bullet

I have a page with radio button that doesn't show the bullet only for same row (name='197' and value='_ for example') DEMO
E.g.
this is the code for the line
<tr>
<td class="generic">197</td>
<td class="generic">PARASPRUZZI RUOTE POSTERIORI</td>
<td>
</td>
<td align="center">
<input type="radio" value="S" name="197" userselection="1">
</td>
<td align="center">
<input type="radio" value="_" name="197" checked="">
</td>
<td align="center">
<input type="radio" value="N" name="197" disabled="">
</td>
</tr>
I don't see where is the mistakes, can you help me?
Because further on down your code (some line ~4579) you have another set of <input>s with the same name 197. One of which has the checked attribute:
<tr>
<td class="Option_S">CMBDS</td>
<td></td>
<td class="Option_S">DIESEL</td>
<td align="center">
<input type="radio" value="S" name="197" checked="">
</td>
<td align="center">
<input type="radio" value="_" name="197" disabled="">
</td>
<td align="center">
<input type="radio" value="N" name="197" disabled="">
</td>
</tr>
JSFiddle
You have others radio with name 197 in html:
<tr>
<td class="Option_S">CMBDS</td>
<td></td>
<td class="Option_S">DIESEL</td>
<td align="center">
<input type="radio" value="S" name="197" checked="">
</td>
<td align="center">
<input type="radio" value="_" name="197" disabled="">
</td>
<td align="center">
<input type="radio" value="N" name="197" disabled="">
</td>
</tr>

Using HTML::Template within a value attribute

my question is how would I use an HTML::Template tag inside a value of form field to change that field. For example
<table border="0" cellpadding="8" cellspacing="1">
<tr>
<td align="right">File:</td>
<td>
<input type="file" name="upload" value= style="width:400px">
</td>
</tr>
<tr>
<td align="right">File Name:</td>
<td>
<input type="text" name="filename" style="width:400px" value="" >
</td>
</tr>
<tr>
<td align="right">Title:</td>
<td>
<input type="text" name="title" style="width:400px" value="" />
</td>
</tr>
<tr>
<td align="right">Date:</td>
<td>
<input type="text" name="date" style="width:400px" value="" />
</td>
</tr>
<tr>
<td colspan="2" align="right">
<input type="button" value="Cancel">
<input type="submit" name="action" value="Upload" />
</td>
</tr>
</table>
I want the value to have a <TMPL_VAR> variable in it.
You use it the same way you'd use a template variable anywhere else:
<input type="text" name="date" style="width:400px" value="<TMPL_VAR NAME=date>" />
Yeah, it's ugly and it breaks your HTML validator. Which is one of the many reasons why I like Template Toolkit better.