Jquery parent child selectors - jquery-selectors

I have the html structure below and I'm trying to select the row containing the text 'Related list item:'.
My Jquery is below:
$('#WebPartWPQ3 > table(eq:2) > tbody > tr > td > table > tbody > tr:last').remove();
but not working...
<DIV id="WebPartWPQ3" fixed_bound allowDelete="false" OnlyForMePart="true" HasPers="true" WebPartID="00000000-0000-0000-0000-000000000000" width="100%">
<TABLE cellSpacing="0" cellPadding="4" width="100%" border="0" fixed_bound xmlns:ddwrt2="urn:frontpage:internal" xmlns:SharePoint="Microsoft.SharePoint.WebControls" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:dsp="http://schemas.microsoft.com/sharepoint/dsp" xmlns:x="http://www.w3.org/2001/XMLSchema">
<TBODY fixed_bound>
<TR fixed_bound>
<TD class="ms-vb" fixed_bound>
</TD>
</TR>
</TBODY>
</TABLE>
<TABLE width="100%" border="0" fixed_bound xmlns:ddwrt2="urn:frontpage:internal" xmlns:SharePoint="Microsoft.SharePoint.WebControls" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:dsp="http://schemas.microsoft.com/sharepoint/dsp" xmlns:x="http://www.w3.org/2001/XMLSchema">
<TBODY fixed_bound>
<TR fixed_bound>
<TD fixed_bound>
<TABLE cellSpacing="0" width="100%" border="0" fixed_bound>
<TBODY fixed_bound>
<TR fixed_bound>
<TD class="ms-formlabel" vAlign="top" noWrap width="25%" fixed_bound>
<B fixed_bound>Title:
</B>
</TD>
<TD class="ms-formbody" vAlign="top" width="75%" fixed_bound>Employee annual leave approval
<BR fixed_bound/>
<BR fixed_bound/>
</TD>
</TR>
<TR fixed_bound>
<TD class="ms-formlabel" width="25%" fixed_bound>
<B fixed_bound>Approved Carry Forward days
<SPAN class="ms-formvalidation" fixed_bound> *
</SPAN>:
</B>
</TD>
<TD class="ms-formbody" width="75%" fixed_bound>
<SPAN fixed_bound>
<INPUT class="ms-input" id="ctl00_PlaceHolderMain_TaskForm_ff1_1_ctl00_ctl00_TextField" title="Approved Carry Forward days" style="IME-MODE: inactive" size="11" name="ctl00$PlaceHolderMain$TaskForm$ff1_1$ctl00$ctl00$TextField" fixed_bound value=""/>
<BR fixed_bound/>
</SPAN>
</TD>
</TR>
<TR fixed_bound>
<TD class="ms-formlabel" width="25%" fixed_bound>
<B fixed_bound>Review Comments:
</B>
</TD>
<TD class="ms-formbody" width="75%" fixed_bound>
<SPAN fixed_bound>
<TEXTAREA class="ms-long" id="ctl00_PlaceHolderMain_TaskForm_ff2_1_ctl00_ctl00_TextField" title="Review Comments" name="ctl00$PlaceHolderMain$TaskForm$ff2_1$ctl00$ctl00$TextField" rows="5" fixed_bound>
</TEXTAREA>
<BR fixed_bound/>
</SPAN>
</TD>
</TR>
<TR fixed_bound>
<TD class="ms-formlabel" vAlign="top" noWrap width="25%" fixed_bound>
<B fixed_bound>Related list item:
</B>
</TD>
<TD class="ms-formbody" vAlign="top" width="75%" fixed_bound>
<A href="http://orange.extra.net/people/hr/Workflows/Expire%20the%20employee%20year%20in%20a%20year/" fixed_bound>
</A>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
<TABLE cellSpacing="0" cellPadding="4" width="100%" border="0" fixed_bound xmlns:ddwrt2="urn:frontpage:internal" xmlns:SharePoint="Microsoft.SharePoint.WebControls" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:dsp="http://schemas.microsoft.com/sharepoint/dsp" xmlns:x="http://www.w3.org/2001/XMLSchema">
<TBODY fixed_bound>
<TR fixed_bound>
<TD class="ms-vb" noWrap fixed_bound>
<INPUT style="DISPLAY: none" onclick="javascript: __doPostBack('ctl00$PlaceHolderMain$TaskForm','__update;__commit;__redirectsource;__redirectToList={};')" type="button" name="btnSave" fixed_bound jQuery1291028280448="3" value="Save Draft"/>
</TD>
<TD fixed_bound>
<INPUT onclick="javascript: __doPostBack('ctl00$PlaceHolderMain$TaskForm','__update;__workflowTaskComplete={0*};__commit;__redirectsource;__redirectToList={};')" type="button" name="btnMarkSubmited" fixed_bound value="Complete Task"/>
</TD>
<TD class="ms-vb" noWrap width="99%" fixed_bound>
<INPUT onclick="javascript: __doPostBack('ctl00$PlaceHolderMain$TaskForm','__cancel;__redirectsource;__redirectToList={};')" type="button" name="btnCancel" fixed_bound value="Cancel"/>
</TD>
</TR>
</TBODY>
</TABLE>
</DIV>

$('.ms-formlabel').last().children().remove();

I prefer to give an id to the tr and remove the tr by id.
$('#trid').remove();

$('#WebPartWPQ3').find('Related list item').closest('tr').remove();

Related

Perl XML::LibXML XPath 2.0 to XPath 1.0

I have the following XPath that works fine in XPath 2.0 (as tested in OxygenXML):
//h2[a[#id='start']]/following-sibling::*[not(preceding-sibling::*[self::div[#id='end']])]
but I'm getting different results when I use it with LibXML findnodes():
my #nodes = $source_doc->findnodes('//h2[a[#id="start"]]/following-sibling::*[not(preceding-sibling::*[self::div[#id="end"]])]');
After checking the LibXML documentation, it seems that LibXML supports XPath 1.0 only. How would I go about changing my XPath to something that works with XPath 1.0? Is it even possible to create a compatible path like this in XPath 1.0?
Since I've been asked to provide, I'm updating the post to include my sample data and the output I'm getting when I run the XPath I entered above:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="insn.css" />
<meta name="generator" content="encodingindex.xsl" />
<title>Index by Encoding</title>
</head>
<body><hr /><h1 class="topleveltable"><a name="top" id="top"></a>Top-level encodings</h1><div
class="regdiagram-32"></div><hr /><h2><a name="dp" id="start"></a>Data-processing and
miscellaneous instructions</h2><div class="decode_navigation">
<p>These instructions are under the top-level.</p>
</div><div class="regdiagram-32">
<table class="regdiagram">
<thead>
<tr>
<td>31</td>
<td>0</td>
</tr>
</thead>
<tbody>
<tr class="firstrow">
<td colspan="4" class="lr">!= 1111</td>
<td colspan="2" class="lr">00</td>
<td class="lr">op0</td>
<td colspan="5" class="lr">op1</td>
<td colspan="12" class="lr"></td>
<td class="lr">op2</td>
<td colspan="2" class="lr">op3</td>
<td class="lr">op4</td>
<td colspan="4" class="lr"></td>
</tr>
</tbody>
</table>
</div><div class="instructiontable">
<table class="instructiontable">
<tr>
<th colspan="5">Decode fields</th>
<th rowspan="2"> Instruction details </th>
</tr>
<tr>
<th class="bitfields">op0</th>
<th class="bitfields">op1</th>
<th class="bitfields">op2</th>
<th class="bitfields">op3</th>
<th class="bitfields">op4</th>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 0 </td>
<td class="bitfield"> </td>
<td class="bitfield"> 1 </td>
<td class="bitfield"> != 00 </td>
<td class="bitfield"> 1 </td>
<td class="iformname">Extra load/store</td>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 0 </td>
<td class="bitfield"> 0xxxx </td>
<td class="bitfield"> 1 </td>
<td class="bitfield"> 00 </td>
<td class="bitfield"> 1 </td>
<td class="iformname">Multiply and Accumulate</td>
</tr>
</table>
</div><hr /><h2><a name="sync" id="sync"></a>Synchronization primitives and
Load-Acquire/Store-Release</h2><div class="decode_navigation">
<p>These instructions are under <a href="#dp">Data-processing and miscellaneous
instructions</a>.</p>
</div><div class="regdiagram-32">
<table class="regdiagram">
<thead>
<tr>
<td>31</td>
<td>0</td>
</tr>
</thead>
<tbody>
<tr class="firstrow">
<td colspan="4" class="lr">!= 1111</td>
<td colspan="4" class="lr">0001</td>
<td class="lr">op0</td>
<td colspan="11" class="lr"></td>
<td colspan="2" class="lr">11</td>
<td colspan="2" class="lr"></td>
<td colspan="4" class="lr">1001</td>
<td colspan="4" class="lr"></td>
</tr>
</tbody>
</table>
</div><hr /><hr /><h2><a name="dpmisc" id="dpmisc"></a>Miscellaneous</h2><div
class="decode_navigation">
<p>These instructions are under <a href="#dp">Data-processing and miscellaneous
instructions</a>.</p>
</div><div class="regdiagram-32">
<table class="regdiagram">
<thead>
<tr>
<td>31</td>
<td>30</td>
<td>0</td>
</tr>
</thead>
<tbody>
<tr class="firstrow">
<td colspan="4" class="lr">!= 1111</td>
<td colspan="5" class="lr">00010</td>
<td colspan="2" class="lr">op0</td>
<td colspan="1" class="lr">0</td>
<td colspan="12" class="lr"></td>
<td colspan="1" class="lr">0</td>
<td colspan="3" class="lr">op1</td>
<td colspan="4" class="lr"></td>
</tr>
</tbody>
</table>
</div><div class="instructiontable">
<table class="instructiontable">
<tr>
<th colspan="2">Decode fields</th>
<th rowspan="2"> Instruction details </th>
</tr>
<tr>
<th class="bitfields">op0</th>
<th class="bitfields">op1</th>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 01 </td>
<td class="bitfield"> 010 </td>
<td class="iformname">BXJ</td>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 01 </td>
<td class="bitfield"> 011 </td>
<td class="iformname">BLX (register)</td>
</tr>
</table>
</div><div class="decode_navigation">
<p>These instructions are under <a href="#dp">Data-processing and miscellaneous
instructions</a>.</p>
</div><div class="regdiagram-32">
<table class="regdiagram">
<thead>
<tr>
<td>31</td>
<td>30</td>
<td>0</td>
</tr>
</thead>
<tbody>
<tr class="firstrow">
<td colspan="4" class="lr">!= 1111</td>
<td colspan="3" class="lr">000</td>
<td colspan="2" class="lr">op0</td>
<td colspan="2" class="lr"></td>
<td class="lr">op1</td>
<td colspan="15" class="lr"></td>
<td colspan="1" class="lr">0</td>
<td colspan="4" class="lr"></td>
</tr>
</tbody>
</table>
</div><div class="decode_constraints">
<p> The following constraints also apply to this encoding: op0:op1 != 100 </p>
</div><div class="instructiontable">
<table class="instructiontable">
<tr>
<th colspan="2">Decode fields</th>
<th rowspan="2"> Instruction details </th>
</tr>
<tr>
<th class="bitfields">op0</th>
<th class="bitfields">op1</th>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 0x </td>
<td class="bitfield"> </td>
<td class="iformname"><a href="#intdp3reg_immsh">Integer Data Processing (three register,
immediate shift)</a></td>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 10 </td>
<td class="bitfield"> 1 </td>
<td class="iformname"><a href="#intdp2reg_immsh">Integer Test and Compare (two register,
immediate shift)</a></td>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 11 </td>
<td class="bitfield"> </td>
<td class="iformname"><a href="#logic3reg_immsh">Logical Arithmetic (three register,
immediate shift)</a></td>
</tr>
</table>
</div><hr /><div class="iclass" id="intdp3reg_immsh">
<a name="intdp3reg_immsh" id="intdp3reg_immsh"></a>
<h3 class="iclass">Integer Data Processing (three register, immediate shift)</h3>
<p>These instructions are under <a href="#dpregis">Data-processing register (immediate
shift)</a>.</p>
<div class="regdiagram-32">
<table class="regdiagram">
<thead>
<tr>
<td>31</td>
<td>0</td>
</tr>
</thead>
<tbody>
<tr class="firstrow">
<td colspan="4" class="lr">!= 1111</td>
<td class="l">0</td>
<td>0</td>
<td>0</td>
<td class="r">0</td>
<td colspan="3" class="lr">opc</td>
<td class="lr">S</td>
<td colspan="4" class="lr">Rn</td>
<td colspan="4" class="lr">Rd</td>
<td colspan="5" class="lr">imm5</td>
<td colspan="2" class="lr">type</td>
<td class="lr">0</td>
<td colspan="4" class="lr">Rm</td>
</tr>
<tr class="secondrow">
<td colspan="4" class="droppedname">cond</td>
<td colspan="4"></td>
<td colspan="3"></td>
<td></td>
<td colspan="4"></td>
<td colspan="4"></td>
<td colspan="5"></td>
<td colspan="2"></td>
<td></td>
<td colspan="4"></td>
</tr>
</tbody>
</table>
</div>
<div class="decode_constraints">
<p> The following constraints also apply to this encoding: cond != 1111 && cond !=
1111 </p>
</div>
<div class="instructiontable">
<table class="instructiontable" id="intdp3reg_immsh">
<thead class="instructiontable">
<tr>
<th class="bitfields-heading" rowspan="" colspan="3">Decode fields</th>
<th class="iformname" rowspan="2" colspan=""> Instruction Details </th>
</tr>
<tr>
<th class="bitfields" rowspan="" colspan="">opc</th>
<th class="bitfields" rowspan="" colspan="">S</th>
<th class="bitfields" rowspan="" colspan="">Rn</th>
</tr>
</thead>
<tbody>
<tr>
<td class="bitfield">000</td>
<td class="bitfield"></td>
<td class="bitfield"></td>
<td class="iformname"><a name="AND_r" href="and_r.html" id="AND_r">AND, ANDS
(register)</a></td>
</tr>
<tr>
<td class="bitfield">001</td>
<td class="bitfield"></td>
<td class="bitfield"></td>
<td class="iformname"><a name="EOR_r" href="eor_r.html" id="EOR_r">EOR, EORS
(register)</a></td>
</tr>
</tbody>
</table>
</div>
</div><div class="decode_constraints">
<p> The following constraints also apply to this encoding: op0:op1 != 100 </p>
</div><div class="instructiontable">
<table class="instructiontable">
<tr>
<th colspan="2">Decode fields</th>
<th rowspan="2"> Instruction details </th>
</tr>
<tr>
<th class="bitfields">op0</th>
<th class="bitfields">op1</th>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 0x </td>
<td class="bitfield"> </td>
<td class="iformname"><a href="#intdp3reg_regsh">Integer Data Processing (three register,
register shift)</a></td>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 10 </td>
<td class="bitfield"> 1 </td>
<td class="iformname"><a href="#intdp2reg_regsh">Integer Test and Compare (two register,
register shift)</a></td>
</tr>
</table>
</div><hr /><h2><a name="dpimm" id="dpimm"></a>Data-processing immediate</h2><div
class="decode_navigation">
<p>These instructions are under <a href="#dp">Data-processing and miscellaneous
instructions</a>.</p>
</div><div class="regdiagram-32">
<table class="regdiagram">
<thead>
<tr>
<td>31</td>
<td>0</td>
</tr>
</thead>
<tbody>
<tr class="firstrow">
<td colspan="4" class="lr">!= 1111</td>
<td colspan="3" class="lr">001</td>
<td colspan="2" class="lr">op0</td>
<td colspan="1" class="lr"></td>
<td colspan="2" class="lr">op1</td>
<td colspan="20" class="lr"></td>
</tr>
</tbody>
</table>
</div><div class="instructiontable">
<table class="instructiontable">
<tr>
<th colspan="2">Decode fields</th>
<th rowspan="2"> Instruction details </th>
</tr>
<tr>
<th class="bitfields">op0</th>
<th class="bitfields">op1</th>
</tr>
<tr class="instructiontable">
<td class="bitfield"> 0x </td>
<td class="bitfield"> </td>
<td class="iformname"><a href="#intdp2reg_imm">Integer Data Processing (two register and
immediate)</a></td>
</tr>
</table>
</div><hr /><div class="iclass" id="intdp2reg_imm">
<a name="intdp2reg_imm" id="intdp2reg_imm"></a>
</div><div class="iclass" id="end">
<a name="ldstimm" id="ldstimm"></a>
<h3 class="iclass">Load/Store Word, Unsigned Byte (immediate, literal)</h3>
<div class="regdiagram-32">
<table class="regdiagram">
<thead>
<tr>
<td>31</td>
<td>0</td>
</tr>
</thead>
<tbody>
<tr class="firstrow">
<td colspan="4" class="lr">!= 1111</td>
<td class="l">0</td>
<td>1</td>
<td class="r">0</td>
<td class="lr">P</td>
<td class="lr">U</td>
<td class="lr">o2</td>
<td class="lr">W</td>
<td class="lr">o1</td>
<td colspan="4" class="lr">Rn</td>
<td colspan="4" class="lr">Rt</td>
<td colspan="12" class="lr">imm12</td>
</tr>
<tr class="secondrow">
<td colspan="4" class="droppedname">cond</td>
<td colspan="3"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan="4"></td>
<td colspan="4"></td>
<td colspan="12"></td>
</tr>
</tbody>
</table>
</div>
<div class="decode_constraints">
<p> The following constraints also apply to this encoding: cond != 1111 && cond !=
1111 </p>
</div>
<div class="instructiontable">
<table class="instructiontable" id="ldstimm">
<thead class="instructiontable">
<tr>
<th class="bitfields-heading" rowspan="" colspan="4">Decode fields</th>
<th class="iformname" rowspan="2" colspan=""> Instruction Details </th>
</tr>
<tr>
<th class="bitfields" rowspan="" colspan="">P:W</th>
<th class="bitfields" rowspan="" colspan="">o2</th>
<th class="bitfields" rowspan="" colspan="">o1</th>
<th class="bitfields" rowspan="" colspan="">Rn</th>
</tr>
</thead>
<tbody>
<tr>
<td class="bitfield">!= 01</td>
<td class="bitfield">0</td>
<td class="bitfield">1</td>
<td class="bitfield">1111</td>
<td class="iformname"><a name="LDR_l" href="ldr_l.html" id="LDR_l">LDR
(literal)</a></td>
</tr>
<tr>
<td class="bitfield">!= 01</td>
<td class="bitfield">1</td>
<td class="bitfield">1</td>
<td class="bitfield">1111</td>
<td class="iformname"><a name="LDRB_l" href="ldrb_l.html" id="LDRB_l">LDRB
(literal)</a></td>
</tr>
</tbody>
</table>
</div>
</div></body>
</html>
Here's the output using the XPath given above:
<div class="decode_navigation">
<p>These instructions are under the top-level.</p>
</div>
Just to clarify, the output should include all of the divs in the sample HTML, about 400 lines in total.
I've also tried the XPath suggestions I've been given below, but they produced the same results.
Edit: Here's my code:
use strict;
use warnings;
use feature 'say';
use XML::LibXML;
my $encoding_index_file = q(C:\path\to\testfile.html);
my $source_doc = XML::LibXML->load_html(
location => $encoding_index_file,
recover => 1,
suppress_errors => 1,
);
my ($node) = $source_doc->findnodes('//h2[a[#id="start"]]/following-sibling::*[not(preceding-sibling::div[#id="end"])]');
say $node->toString;
Not only does that XPath conform to XPath 1.0, it works correctly in XML::LibXML.
use strict;
use warnings qw( all );
use feature qw( say );
use XML::LibXML qw( );
my $doc = XML::LibXML->new->parse_html_string(<<'__EOS__');
<html>
<h2><a id="start">Foo</a></h2>
<div id="pre1"><img></div>
<div id="pre2"><img></div>
<div id="end"><img></div>
<div id="post1"><img></div>
<div id="post2"><img></div>
</html>
__EOS__
# Select all the siblings of the starting h2 element that follow
# it and don't have <div id="end"/> as a preceding sibling.
for my $node ($doc->findnodes('//h2[a[#id="start"]]/following-sibling::*[not(preceding-sibling::*[self::div[#id="end"]])]')) {
my $name = $node->nodeName;
my $id = $node->getAttribute('id');
say $id ? sprintf("%s#%s", $name, $id) : $name;
}
Output:
div#pre1
div#pre2
div#end
By the way,
//h2[a[#id="start"]]/following-sibling::*[not(preceding-sibling::*[self::div[#id="end"]])]
is a weird way of writing
//h2[a[#id="start"]]/following-sibling::*[not(preceding-sibling::div[#id="end"])]
Maybe you wanted
//h2[a[#id="start"]]/following-sibling::*[not(self::div[#id="end"] or preceding-sibling::div[#id="end"])]
That would produce the following output:
div#pre1
div#pre2
I managed to get to the bottom of what was causing the problem: Every sibling found by the XPath is handled by LibXML as a separate node, so I needed to assign them to an array, not a simple scalar as I was doing. The not-weird XPath suggested by ikegami was also better than the one I was using, as mine was doubling up everything in the output.
Here's the code that produces the correct results:
use strict;
use warnings;
use feature 'say';
use XML::LibXML qw( );
my $encoding_index_file = q(C:\path\to\testfile.html);
my $source_doc = XML::LibXML->load_html(
location => $encoding_index_file,
recover => 1,
suppress_errors => 1,
);
my $contents = "";
my #nodes = $source_doc->findnodes('//h2[a[#id="start"]]/following-sibling::[not(preceding-sibling::div[#id="end"])]');
foreach my $node (#nodes) {
my ($str) = $node->toString;
$contents = $contents . $str;
}
print $contents;

Cannot read the table elements in Protractor

Trying to read the following table.
<div class="well" style="background-color: #fff;">
<table class="table table-bordered table-striped table-condensed">
<tbody><tr>
<td style="width: 20%; vertical-align: middle">
<span class="label label-primary">Field0</span>
</td>
<td>Value0</td>
</tr>
<tr>
<td style="width: 120px;">Field1</td>
<td>Value1</td>
</tr>
<tr>
<td><strong>Field2</strong></td>
<td>Value2</td>
</tr>
</tbody>
</table>
</div>
However, I am stuck when I am trying to get each of the values individually.
"return $$('.well').get(0).all(by.tagName('td')).get(0).getText();"

Posting form in JSoup doesn't produce any response

I'd like to automatically retrieve the results of searching for a Chinese character on this webpage. After inputting a character such as '馬' into the search field labelled '字形', submitting the form produces a form called 'HiddenFrom' as follows, the contents of which I'm aiming to output (which would look like the following):
<form Id="HiddenFrom" action="/yanbian/PageResult/PageResult" method="post" onclick="Sys.Mvc.AsyncForm.handleClick(this, new Sys.UI.DomEvent(event));" onsubmit="Sys.Mvc.AsyncForm.handleSubmit(this, new Sys.UI.DomEvent(event), { insertionMode: Sys.Mvc.InsertionMode.replace, httpMethod: 'Post', updateTargetId: 'PageResult', onSuccess: Function.createDelegate(this, Feedback) });"><input id="ZiOrder" name="ZiOrder" type="hidden" value="" />
<input id="EudcFontChar" name="EudcFontChar" type="hidden" value="馬" />
<input id="PageNo" name="PageNo" type="hidden" value="" />
<input id="Reference" name="Reference" type="hidden" value="" />
<input id="IsZiTou" name="IsZiTou" type="hidden" value="0" />
<table border="0" cellspacing="0" cellpadding="0" width="95%" id="yanbian_result">
<tr>
<td colspan="10" align="left">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="ZiList"><span id="StartOrder">6104</span></td>
<td><img src="/ImageText2/ShowImage.ashx?text=%e9%a6%ac&font=%e6%a8%99%e6%a5%b7%e9%ab%94&size=29&style=regular&color=%23000000" alt="&0.99AC;" class="charValue" style="vertical-align:text-bottom" /></td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="10" align="right" class="Information">
共搜尋到17字,字形大小:<select name="ImageSize" id="ImageSize">
<option value="16">16</option>
<option value="20">20</option>
<option value="24">24</option>
<option value="28">28</option>
<option value="32">32</option>
<option value="36" selected="selected">36</option>
<option value="40">40</option>
<option value="44">44</option>
<option value="48">48</option>
<option value="54">54</option>
<option value="60">60</option>
<option value="66">66</option>
<option value="72">72</option>
</select>點
</td>
</tr>
<tr>
<td colspan="10" align="center" valign="top"> </td>
</tr>
<tr><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%8d%b2&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%94%b2%e9%aa%a8%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&43.E372;" class="charValue" style="vertical-align:text-bottom" /><br />鐵2.2(甲)<br /><td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%8d%b3&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%94%b2%e9%aa%a8%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&43.E373;" class="charValue" style="vertical-align:text-bottom" /><br />乙9092(甲)<br /><td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%8e%82&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%94%b2%e9%aa%a8%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&43.E382;" class="charValue" style="vertical-align:text-bottom" /><br />甲1286(甲)<br /><td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%8e%98&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%94%b2%e9%aa%a8%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&43.E398;" class="charValue" style="vertical-align:text-bottom" /><br />林1.23.20(甲)<br /><td><td align="center" class="VariantListB"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%81&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E881;" class="charValue" style="vertical-align:text-bottom" /><br />戊寅作父丁方鼎(金)<br />商代晚期<td><tr>
<tr><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%8a&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E88A;" class="charValue" style="vertical-align:text-bottom" /><br />彔伯戈冬簋蓋(金)<br />西周中期<td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%b9&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E8B9;" class="charValue" style="vertical-align:text-bottom" /><br />大𤔲馬簠(金)<br />春秋早期<td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%bd&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E8BD;" class="charValue" style="vertical-align:text-bottom" /><br />伯亞臣𦉢(金)<br />春秋<td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%be&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E8BE;" class="charValue" style="vertical-align:text-bottom" /><br />妾子𧊒壺(金)<br />戰國晚期<td><td align="center" class="VariantListB"><img src="/ImageText2/ShowImage.ashx?text=%ee%a3%80&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E8C0;" class="charValue" style="vertical-align:text-bottom" /><br />燕侯載器(金)<br />戰國<td><tr>
<tr><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%86%bb&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e6%a5%9a%e7%b3%bb%e7%b0%a1%e5%b8%9b%e6%96%87%e5%ad%97%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&53.E1BB;" class="charValue" style="vertical-align:text-bottom" /><br />曾150(楚)<br /><td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%85%ab&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e6%a5%9a%e7%b3%bb%e7%b0%a1%e5%b8%9b%e6%96%87%e5%ad%97%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&53.E16B;" class="charValue" style="vertical-align:text-bottom" /><br />包2.30(楚)<br /><td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%85%af&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e6%a5%9a%e7%b3%bb%e7%b0%a1%e5%b8%9b%e6%96%87%e5%ad%97%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&53.E16F;" class="charValue" style="vertical-align:text-bottom" /><br />包2.103(楚)<br /><td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a0%9a&font=%e5%8c%97%e5%b8%ab%e5%a4%a7%e8%aa%aa%e6%96%87%e5%b0%8f%e7%af%86&size=36&style=regular&color=%23000000" alt="&27.E81A;" class="charValue" style="vertical-align:text-bottom" /><br />說文古文<br /><td><td align="center" class="VariantListB"><img src="/ImageText2/ShowImage.ashx?text=%ee%a0%9b&font=%e5%8c%97%e5%b8%ab%e5%a4%a7%e8%aa%aa%e6%96%87%e5%b0%8f%e7%af%86&size=36&style=regular&color=%23000000" alt="&27.E81B;" class="charValue" style="vertical-align:text-bottom" /><br />說文籀文<br /><td><tr>
<tr><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%e9%a6%ac&font=%e5%8c%97%e5%b8%ab%e5%a4%a7%e8%aa%aa%e6%96%87%e5%b0%8f%e7%af%86&size=36&style=regular&color=%23000000" alt="&27.99AC;" class="charValue" style="vertical-align:text-bottom" /><br />說文‧馬部<br /><td><td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%aa%8d&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%a7%a6%e7%b3%bb%e7%b0%a1%e7%89%98%e6%96%87%e5%ad%97%e9%87%8d%e6%96%87%e4%b8%80&size=36&style=regular&color=%23000000" alt="&71.EA8D;" class="charValue" style="vertical-align:text-bottom" /><br />睡.雜26(秦)<br /><td><td align="center" class="VariantListA"> <td><td align="center" class="VariantListA"> <td><td align="center" class="VariantListB"> <td></tr>
<tr>
<td colspan="10" align="center" valign="top" style="border-style: solid; border-width: 1px 0px 0px 0px; border-color: #808080"> <p class="RemindMessage">(點選字形可取得字形編輯資訊)</p></td>
</tr>
<tr>
<td colspan="10" align="center" valign="top"> </td>
</tr>
</table>
</form>
<p class="MessageTitle" style="width: 80px">漢語大字典</p>
<dl style="width: 95%" class="control">
<dd class="size">《說文》:“馬,怒也;武也。象馬頭髦尾四足之形。<img src="/ImageText2/ShowImage.ashx?text=%f0%a2%92%a0&font=%e7%b4%b0%e6%98%8e%e9%ab%94&size=13&style=regular&color=%23000000" class="NtSize" style="vertical-align:text-bottom" />,古文。<img src="/ImageText2/ShowImage.ashx?text=%f0%a2%92%a0&font=%e7%b4%b0%e6%98%8e%e9%ab%94&size=13&style=regular&color=%23000000" class="NtSize" style="vertical-align:text-bottom" />,籀文馬與<img src="/ImageText2/ShowImage.ashx?text=%f0%a2%92%a0&font=%e7%b4%b0%e6%98%8e%e9%ab%94&size=13&style=regular&color=%23000000" class="NtSize" style="vertical-align:text-bottom" />同,有髦。”</dd>
</dl>
<dl style="width: 95%" class="control">
<dd style="text-align: right">字體:<a id="smallSize" class="size">小</a>.<a id="middleSize" class="size">中</a>.<a id="largeSize" class="size">大</a></dd>
</dl>
<p class="MessageTitle" style="width: 64px">相關連結</p>
<ul style="width: 95%">
<li>小學堂異體字表、小篆、金文、甲骨文、楚系簡帛文字、秦系簡牘文字、傳抄古文字</li>
<li>小學堂上古音、中古音、官話、晉語、吳語、贛語、湘語、閩語、粵語、平話、客語、其他土話</li>
<li>小學堂韻書集成、廣韻、集韻、附釋文互註禮部韻略、增修互注禮部韻略、中原音韻、中州音韻、洪武正韻</li>
<li>國際電腦漢字與異體字知識庫(含漢語大字典釋義)</li>
<li>教育部異體字字典</li>
<li>開放康熙字典</li>
<li>遠流活用中文大辭典</li>
</ul>
<p class="MessageTitle" style="width: 64px">相關索引</p>
<ul style="width: 95%">
<li>漢語大字典(遠東圖書公司),冊.頁.字:7.4539.1</li>
<li>漢語大字典(建宏出版社),頁.字:1886.17</li>
<li>康熙字典(中華書局),頁.字:1433.01</li>
<li>中文大辭典(中華學術院),冊.編號:10.45550</li>
<li>說文解字(中華書局),卷.部首:10上.馬部</li>
<li>說文解字詁林正補合編(鼎文書局),冊.頁:8.383</li>
<li>說文新證(藝文印書館),冊頁:下98</li>
<li>說文新證(福建人民出版社),頁:770</li>
<li>金文編(中華書局),頁.行:675.3</li>
<li>金文詁林(香港中文大學),卷.頁:10.1</li>
<li>金文詁林補(中央研究院),冊.卷.頁:5.10.3073</li>
<li>殷周金文集成引得(中華書局),字號.頁:3538.1060</li>
<li>新金文編(作家出版社),冊頁:中1387</li>
<li>甲骨文編(中華書局),頁.行:397.3</li>
<li>甲骨文字詁林(吉林大學),冊.頁:2.1589</li>
<li>甲骨文字集釋(中央研究院),卷.頁:10.3031</li>
<li>殷墟甲骨刻辭類纂(吉林大學),冊頁:中624</li>
<li>新甲骨文編(福建人民出版社),頁.行:539.3</li>
<li>甲骨文字編(中華書局),字號.冊頁:1928.中573</li>
<li>楚系簡帛文字編(增訂本)(湖北教育出版社),頁.行:853.2</li>
<li>睡虎地秦簡文字編(文物出版社),頁.行:153.2</li>
<li>秦簡牘文字編(福建人民出版社),頁:289</li>
<li>戰國古文字典:戰國古文聲系(中華書局),冊頁:上605</li>
<li>傳抄古文字編(綫裝書局),冊頁.行:下963.1</li>
</ul>
... However, my program only outputs the contents of the default landing page, and thus contains no mention of that form:
<td id="PageResult" align="left" valign="top" style="margin: 0px;">
<div style="width: 95%"></div>
<div id="Index">
<p class="MessageTitle" style="width: 64px">最新消息</p>
<ul style="width: 95%">
<li class="MessageList">小學堂字形演變資料庫由行政院國家科學委員會經費補助,中央研究院歷史語言研究所和資訊科學研究所共同開發,歡迎大家使用!(2013/09/25)</li>
<li class="MessageList">本資料庫共收錄字頭13098個,字形28321個。(2016/3/23)</li>
</ul>
<p class="MessageTitle" style="width: 64px">快速入門</p>
<ul style="width: 95%">
<li>適用瀏覽器:IE 8.0 以上版本、Firefox 4 以上版本、Google Chrome、Safari 5 以上版本</li>
<li>檢索條件的文字方塊內按<span class="MessagePoint">F1</span>鍵,可快速取得操作指引。</li>
<li>小學堂字形演變資料庫使用簡介。</li>
</ul>
</div> </td>
The code I've produced, based on what I can gather from other StackOverflow posts, is as follows. It successfully connects to the page, but either the post fails or the results aren't being read correctly:
import org.jsoup.Connection;
import org.jsoup.Jsoup;
import org.jsoup.nodes.Document;
import org.jsoup.nodes.Element;
import org.jsoup.nodes.FormElement;
import org.jsoup.select.Elements;
import java.io.IOException;
public class ImgURLExtractor {
public void sendPostAndPrintResponse(String kanjiToSearch) throws IOException {
Document doc = Jsoup.connect("http://xiaoxue.iis.sinica.edu.tw/yanbian")
.data("ZiOrder", "") // The 'ZiOrder' form field can be left blank.
.data("EudcFontChar", kanjiToSearch)
// 'EudcFontChar' is the id of the search field I want to enter my query '馬' into.
.method(Connection.Method.POST)
.post();
Elements target = doc.select("#PageResult");
// The table row '#PageResult' should contain the 'HiddenFrom' form.
System.out.println(target.toString());
}
public static void main(String[] args) throws IOException {
ImgURLExtractor example = new ImgURLExtractor();
example.sendPostAndPrintResponse("馬");
}
}
Thanks if anyone can help.
Looking at the Network tab of Chrome's Developer Tools (or Firefox) you can examine the exact request that is sent to the server. The response from the server is what you are looking for.
Here is a snapshot of the Dev Tools: (you can see the POST request URL and also the data being sent)
So all you need to do is to imitate sending this request to the server and get what you need in the response.
Here is a sample Java code for sending a POST request using OkHttp library:
package com.sample;
import java.io.IOException;
import java.io.UnsupportedEncodingException;
import java.net.URLEncoder;
import okhttp3.MediaType;
import okhttp3.OkHttpClient;
import okhttp3.Request;
import okhttp3.RequestBody;
import okhttp3.Response;
public class PostExample {
private static final MediaType FORM = MediaType.parse("application/x-www-form-urlencoded; charset=UTF-8");
private OkHttpClient client = new OkHttpClient();
private String post(String url, String formData) throws IOException {
RequestBody body = RequestBody.create(FORM, formData);
Request request = new Request.Builder().url(url).post(body).build();
Response response = client.newCall(request).execute();
return response.body().string();
}
private String createFormData(String ziOrder, String eudcFontChar) throws UnsupportedEncodingException {
return "ZiOrder=" + URLEncoder.encode(ziOrder, "UTF-8") +
"&EudcFontChar=" + URLEncoder.encode(eudcFontChar, "UTF-8") +
"&ImageSize=36&X-Requested-With=XMLHttpRequest";
}
public static void main(String[] args) throws IOException {
PostExample example = new PostExample();
String formData = example.createFormData("", THE_CHINESE_CHAR);
String response = example.post("http://xiaoxue.iis.sinica.edu.tw/yanbian/PageResult/PageResult", formData);
System.out.println(response);
}
}
Running this code will return the HiddenFrom:
<form Id="HiddenFrom"...
Thanks to Navid (above) putting me back on the right track with his OkHttp code (showing that I should point to the PageResult/PageResult directory instead of the root), and finding an example usage of the 'org.jsoup.Connection.Response' class, I was able to also get the program working in JSoup. Here it is for reference:
import org.jsoup.Connection;
import org.jsoup.Jsoup;
import org.jsoup.Connection.Response;
import org.jsoup.nodes.Document;
import org.jsoup.nodes.Element;
import org.jsoup.nodes.FormElement;
import org.jsoup.select.Elements;
import java.io.IOException;
public class ImgURLExtractor {
public void sendPostAndPrintResponse(String kanjiToSearch) throws IOException {
Response response = Jsoup.connect("http://xiaoxue.iis.sinica.edu.tw/yanbian/PageResult/PageResult")
.data("ZiOrder", "")
.data("EudcFontChar", kanjiToSearch)
.data("ImageSize", "36")
.data("X-Requested-With", "XMLHTTPRequest")
.method(Connection.Method.POST)
.timeout(10000) // This website can actually take a while to respond
.execute();
System.out.println(response.parse());
// Payload should include: /ImageText2/ShowImage.ashx?text=&font=中研院甲骨文重文三&size=36&style=regular&color=%23000000
}
public static void main(String[] args) throws IOException {
ImgURLExtractor example = new ImgURLExtractor();
example.sendPostAndPrintResponse("馬");
}
}
It returns:
<html>
<head></head>
<body>
<form id="HiddenFrom" action="/yanbian/PageResult/PageResult" method="post" onclick="Sys.Mvc.AsyncForm.handleClick(this, new Sys.UI.DomEvent(event));" onsubmit="Sys.Mvc.AsyncForm.handleSubmit(this, new Sys.UI.DomEvent(event), { insertionMode: Sys.Mvc.InsertionMode.replace, httpMethod: 'Post', updateTargetId: 'PageResult', onSuccess: Function.createDelegate(this, Feedback) });">
<input id="ZiOrder" name="ZiOrder" type="hidden" value="">
<input id="EudcFontChar" name="EudcFontChar" type="hidden" value="馬">
<input id="PageNo" name="PageNo" type="hidden" value="">
<input id="Reference" name="Reference" type="hidden" value="">
<input id="IsZiTou" name="IsZiTou" type="hidden" value="0">
<table border="0" cellspacing="0" cellpadding="0" width="95%" id="yanbian_result">
<tbody>
<tr>
<td colspan="10" align="left">
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="ZiList"><span id="StartOrder">6104</span></td>
<td><img src="/ImageText2/ShowImage.ashx?text=%e9%a6%ac&font=%e6%a8%99%e6%a5%b7%e9%ab%94&size=29&style=regular&color=%23000000" alt="&0.99AC;" class="charValue" style="vertical-align:text-bottom"></td>
</tr>
</tbody>
</table> </td>
</tr>
<tr>
<td colspan="10" align="right" class="Information"> 共搜尋到17字,字形大小:<select name="ImageSize" id="ImageSize"> <option value="16">16</option> <option value="20">20</option> <option value="24">24</option> <option value="28">28</option> <option value="32">32</option> <option value="36" selected>36</option> <option value="40">40</option> <option value="44">44</option> <option value="48">48</option> <option value="54">54</option> <option value="60">60</option> <option value="66">66</option> <option value="72">72</option> </select>點 </td>
</tr>
<tr>
<td colspan="10" align="center" valign="top"> </td>
</tr>
<tr>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%8d%b2&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%94%b2%e9%aa%a8%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&43.E372;" class="charValue" style="vertical-align:text-bottom"><br>鐵2.2(甲)<br></td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%8d%b3&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%94%b2%e9%aa%a8%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&43.E373;" class="charValue" style="vertical-align:text-bottom"><br>乙9092(甲)<br></td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%8e%82&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%94%b2%e9%aa%a8%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&43.E382;" class="charValue" style="vertical-align:text-bottom"><br>甲1286(甲)<br></td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%8e%98&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%94%b2%e9%aa%a8%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&43.E398;" class="charValue" style="vertical-align:text-bottom"><br>林1.23.20(甲)<br></td>
<td></td>
<td align="center" class="VariantListB"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%81&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E881;" class="charValue" style="vertical-align:text-bottom"><br>戊寅作父丁方鼎(金)<br>商代晚期</td>
<td></td>
</tr>
<tr>
</tr>
<tr>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%8a&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E88A;" class="charValue" style="vertical-align:text-bottom"><br>彔伯戈冬簋蓋(金)<br>西周中期</td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%b9&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E8B9;" class="charValue" style="vertical-align:text-bottom"><br>大𤔲馬簠(金)<br>春秋早期</td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%bd&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E8BD;" class="charValue" style="vertical-align:text-bottom"><br>伯亞臣𦉢(金)<br>春秋</td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a2%be&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E8BE;" class="charValue" style="vertical-align:text-bottom"><br>妾子𧊒壺(金)<br>戰國晚期</td>
<td></td>
<td align="center" class="VariantListB"><img src="/ImageText2/ShowImage.ashx?text=%ee%a3%80&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e9%87%91%e6%96%87%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&33.E8C0;" class="charValue" style="vertical-align:text-bottom"><br>燕侯載器(金)<br>戰國</td>
<td></td>
</tr>
<tr>
</tr>
<tr>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%86%bb&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e6%a5%9a%e7%b3%bb%e7%b0%a1%e5%b8%9b%e6%96%87%e5%ad%97%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&53.E1BB;" class="charValue" style="vertical-align:text-bottom"><br>曾150(楚)<br></td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%85%ab&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e6%a5%9a%e7%b3%bb%e7%b0%a1%e5%b8%9b%e6%96%87%e5%ad%97%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&53.E16B;" class="charValue" style="vertical-align:text-bottom"><br>包2.30(楚)<br></td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%85%af&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e6%a5%9a%e7%b3%bb%e7%b0%a1%e5%b8%9b%e6%96%87%e5%ad%97%e9%87%8d%e6%96%87%e4%b8%89&size=36&style=regular&color=%23000000" alt="&53.E16F;" class="charValue" style="vertical-align:text-bottom"><br>包2.103(楚)<br></td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%a0%9a&font=%e5%8c%97%e5%b8%ab%e5%a4%a7%e8%aa%aa%e6%96%87%e5%b0%8f%e7%af%86&size=36&style=regular&color=%23000000" alt="&27.E81A;" class="charValue" style="vertical-align:text-bottom"><br>說文古文<br></td>
<td></td>
<td align="center" class="VariantListB"><img src="/ImageText2/ShowImage.ashx?text=%ee%a0%9b&font=%e5%8c%97%e5%b8%ab%e5%a4%a7%e8%aa%aa%e6%96%87%e5%b0%8f%e7%af%86&size=36&style=regular&color=%23000000" alt="&27.E81B;" class="charValue" style="vertical-align:text-bottom"><br>說文籀文<br></td>
<td></td>
</tr>
<tr>
</tr>
<tr>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%e9%a6%ac&font=%e5%8c%97%e5%b8%ab%e5%a4%a7%e8%aa%aa%e6%96%87%e5%b0%8f%e7%af%86&size=36&style=regular&color=%23000000" alt="&27.99AC;" class="charValue" style="vertical-align:text-bottom"><br>說文‧馬部<br></td>
<td></td>
<td align="center" class="VariantListA"><img src="/ImageText2/ShowImage.ashx?text=%ee%aa%8d&font=%e4%b8%ad%e7%a0%94%e9%99%a2%e7%a7%a6%e7%b3%bb%e7%b0%a1%e7%89%98%e6%96%87%e5%ad%97%e9%87%8d%e6%96%87%e4%b8%80&size=36&style=regular&color=%23000000" alt="&71.EA8D;" class="charValue" style="vertical-align:text-bottom"><br>睡.雜26(秦)<br></td>
<td></td>
<td align="center" class="VariantListA"> </td>
<td></td>
<td align="center" class="VariantListA"> </td>
<td></td>
<td align="center" class="VariantListB"> </td>
<td></td>
</tr>
<tr>
<td colspan="10" align="center" valign="top" style="border-style: solid; border-width: 1px 0px 0px 0px; border-color: #808080"> <p class="RemindMessage">(點選字形可取得字形編輯資訊)</p></td>
</tr>
<tr>
<td colspan="10" align="center" valign="top"> </td>
</tr>
</tbody>
</table>
</form>
<p class="MessageTitle" style="width: 80px">漢語大字典</p>
<dl style="width: 95%" class="control">
<dd class="size">
《說文》:“馬,怒也;武也。象馬頭髦尾四足之形。
<img src="/ImageText2/ShowImage.ashx?text=%f0%a2%92%a0&font=%e7%b4%b0%e6%98%8e%e9%ab%94&size=13&style=regular&color=%23000000" class="NtSize" style="vertical-align:text-bottom">,古文。
<img src="/ImageText2/ShowImage.ashx?text=%f0%a2%92%a0&font=%e7%b4%b0%e6%98%8e%e9%ab%94&size=13&style=regular&color=%23000000" class="NtSize" style="vertical-align:text-bottom">,籀文馬與
<img src="/ImageText2/ShowImage.ashx?text=%f0%a2%92%a0&font=%e7%b4%b0%e6%98%8e%e9%ab%94&size=13&style=regular&color=%23000000" class="NtSize" style="vertical-align:text-bottom">同,有髦。”
</dd>
</dl>
<dl style="width: 95%" class="control">
<dd style="text-align: right">
字體:
<a id="smallSize" class="size">小</a>.
<a id="middleSize" class="size">中</a>.
<a id="largeSize" class="size">大</a>
</dd>
</dl>
<p class="MessageTitle" style="width: 64px">相關連結</p>
<ul style="width: 95%">
<li>小學堂異體字表、小篆、金文、甲骨文、楚系簡帛文字、秦系簡牘文字、傳抄古文字</li>
<li>小學堂上古音、中古音、官話、晉語、吳語、贛語、湘語、閩語、粵語、平話、客語、其他土話</li>
<li>小學堂韻書集成、廣韻、集韻、附釋文互註禮部韻略、增修互注禮部韻略、中原音韻、中州音韻、洪武正韻</li>
<li>國際電腦漢字與異體字知識庫(含漢語大字典釋義)</li>
<li>教育部異體字字典</li>
<li>開放康熙字典</li>
<li>遠流活用中文大辭典</li>
</ul>
<p class="MessageTitle" style="width: 64px">相關索引</p>
<ul style="width: 95%">
<li>漢語大字典(遠東圖書公司),冊.頁.字:7.4539.1</li>
<li>漢語大字典(建宏出版社),頁.字:1886.17</li>
<li>康熙字典(中華書局),頁.字:1433.01</li>
<li>中文大辭典(中華學術院),冊.編號:10.45550</li>
<li>說文解字(中華書局),卷.部首:10上.馬部</li>
<li>說文解字詁林正補合編(鼎文書局),冊.頁:8.383</li>
<li>說文新證(藝文印書館),冊頁:下98</li>
<li>說文新證(福建人民出版社),頁:770</li>
<li>金文編(中華書局),頁.行:675.3</li>
<li>金文詁林(香港中文大學),卷.頁:10.1</li>
<li>金文詁林補(中央研究院),冊.卷.頁:5.10.3073</li>
<li>殷周金文集成引得(中華書局),字號.頁:3538.1060</li>
<li>新金文編(作家出版社),冊頁:中1387</li>
<li>甲骨文編(中華書局),頁.行:397.3</li>
<li>甲骨文字詁林(吉林大學),冊.頁:2.1589</li>
<li>甲骨文字集釋(中央研究院),卷.頁:10.3031</li>
<li>殷墟甲骨刻辭類纂(吉林大學),冊頁:中624</li>
<li>新甲骨文編(福建人民出版社),頁.行:539.3</li>
<li>甲骨文字編(中華書局),字號.冊頁:1928.中573</li>
<li>楚系簡帛文字編(增訂本)(湖北教育出版社),頁.行:853.2</li>
<li>睡虎地秦簡文字編(文物出版社),頁.行:153.2</li>
<li>秦簡牘文字編(福建人民出版社),頁:289</li>
<li>戰國古文字典:戰國古文聲系(中華書局),冊頁:上605</li>
<li>傳抄古文字編(綫裝書局),冊頁.行:下963.1</li>
</ul>
</body>
</html>
Process finished with exit code 0

zurb ink email wrapper doesnt span across full width

I'm having issues with Zurb Ink's email. So it looks fine in desktop, however it there is this gap when it hits the media queries and it seems to be doing it with the containers when its stacked on top of each other. I want it to span the whole width.
http://i.stack.imgur.com/xygNK.png
Here is my code:
<table class="container" id="hero-container">
<!-- hero logo -->
<tr>
<td>
<table class="row">
<tr>
<td class="wrapper last">
<table class="twelve columns">
<tr>
<td id="hero-logo"><img id="logoImage" src="images/hero-logo.png" alt="Hero In The News" /></td>
<td class="expander"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- /hero logo -->
<!-- hero image -->
<tr>
<td>
<table class="row">
<tr>
<td class="wrapper last">
<table class="twelve columns">
<tr>
<td><img id="headerImage" src="images/hero-img.png" alt="City of San Jose - Capital of Silicon Valley" /></td>
<td class="expander"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- /hero image -->
<!-- hero main article -->
<tr>
<td>
<table class="row">
<tr>
<td>
<div class="wrapper last">
<table class="twelve columns">
<tr>
<td class="heading1 text-pad">Residents can Pace Energy Use <br/>with New Program</td>
<td class="expander"></td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table class="row">
<tr>
<td>
<div class="wrapper last">
<table class="twelve columns">
<tr>
<td class="text-pad"><p>The city of San Jose has implemented a program to help residents pace their water and energy consumption. </p></td>
<td class="expander"></td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</td>
</tr>
<!-- button -->
<tr>
<td>
<table class="row">
<tr>
<td>
<div class="wrapper last">
<table class="twelve columns">
<tr>
<td class="text-pad link"><p>Read Full Article</p></td>
<td class="expander"></td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</td>
</tr>
<!--/button -->
<!-- /hero main article -->
</table>
<!-- articles row 1 -->
<table class="container">
<tr>
<td>
<table class="row">
<tr>
<td class="wrapper">
<table class="six columns article">
<tr>
<td class="text-pad">
<h2>Energy Efficiency Program Ushers Green Jobs into Kern</h2>
<p>The green economy has arrived in Kern County, and not a moment...</p>
</td>
<td class="expander"></td>
</tr>
</table>
</td>
<td class="wrapper last">
<table class="six columns article">
<tr>
<td class="text-pad">
<h2>Stockton Gets a New “HERO”</h2>
<p>From insulation to more efficient air conditioning to solar panels to...</p>
</td>
<td class="expander"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- /articles row 1-->
<!-- articles row 2 -->
<table class="container article-container">
<tr>
<td>
<table class="row">
<tr>
<td class="wrapper article-wrapper">
<table class="six columns article">
<tr>
<td class="text-pad">
<h2>Fresno estimates $56M from HERO program</h2>
<p>Officials with the City of Fresno expect to see more than $56 M...</p>
</td>
<td class="expander"></td>
</tr>
</table>
</td>
<td class="wrapper last article-wrapper-last">
<table class="six columns article">
<tr>
<td class="text-pad">
<h2>Lompoc City Council approves HERO Program</h2>
<p>A new program that helps homeowners make energy and...</p>
</td>
<td class="expander"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
Caveat: I am new to Ink myself. What "jumps out" at me is that you're using a container on the outside and multiple rows inside. For full width, swap the row and container classes --> so that the table with class row contains a table with class container.

Form has Disabled Inputs, How to make Processing Page not try to process disabled fields?

I have a form where I disable the Shipping address when they click the "Same as Billing address" checkbox via JQuery.
When the form is submitted, the disabled fields (shipping) obviously do not pass any data but my processing form is saying that those specific fields are undefined.
How can I make the processing form not look for the values of the disabled fields (shipping), if they are disabled?
HERE IS THE PROCESSING FORM:
<cfset orderno = #numberFormat(randrange(00001,99999), "00000")#>
<cfmail to="xxx" from="xxx" subject="xxxx ORDER No. #orderno#" server="xxx" username="xx" password="xxx" type="html">
<img src="http://www.mmprint.com/index_files/maillogo.jpg" width="500" height="85" /> <br /><br /> <font face="Arial" size="+3"><strong>NEW LIVE JOB - <font color="##FF0000">CMS-1500 BLANK </font> Form Order No. <cfoutput>#orderno#</cfoutput> </strong>
<table border="1" bordercolor="##660000" cellpadding="2" cellspacing="0">
<tr>
<td colspan="2"><h2>CMS-1500 Order Information:</h2></td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Quantity:</td><td align="left" valign="top">#form.qty#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Type:</td><td align="left" valign="top">#form.cctype#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">CC Number:</td><td align="left" valign="top">#form.ccnumber#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">CC Month:</td><td align="left" valign="top">#form.ccmonth#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">CC Year:</td><td align="left" valign="top">#form.ccyear#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">CSV:</td><td align="left" valign="top">#form.csv#</td>
</tr>
<!-- Billing Info -->
<tr>
<td><h2>Billing Information:</h2></td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Company Name:</td><td align="left" valign="top">#form.bconame#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">First Name:</td><td align="left" valign="top">#form.bfname#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Last Name:</td><td align="left" valign="top">#form.blname#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Address:</td><td align="left" valign="top">#form.baddress#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Address:</td><td align="left" valign="top">#form.baddress2#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Address:</td><td align="left" valign="top">#form.bcity#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Address:</td><td align="left" valign="top">#form.bstate#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Address:</td><td align="left" valign="top">#form.bzip#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Email:</td><td align="left" valign="top">#form.email#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Comments:</td><td align="left" valign="top">#form.comments#</td>
</tr>
</table>
<br />
<br />
<!-- SHIPPING INFO -->
<table border="1" bordercolor="##660000" cellpadding="2" cellspacing="0">
<tr>
<td><h2>Shipping Information:</h2></td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Company Name:</td><td align="left" valign="top">#form.coname#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">First Name:</td><td align="left" valign="top">#form.fname#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Last Name:</td><td align="left" valign="top">#form.lname#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Address:</td><td align="left" valign="top">#form.address#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Address 2:</td><td align="left" valign="top">#form.address2#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">City:</td><td align="left" valign="top">#form.city#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">State:</td><td align="left" valign="top">#form.state#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Zip:</td><td align="left" valign="top">#form.zip#</td>
</tr>
</table>
</font>
</cfmail>
<cfmail to="#form.email#" from="xxx" bcc="xxx" subject="Thank You for your order - No. #orderno#" server="xxx" username="xxx" password="xxx" type="html">
<p><img src="xxx" width="500" height="85" /></p>
<p><font face="Arial" size="+1"><strong><font color="##006600">Order Confirmation- </font>- No. <cfoutput>#orderno#</cfoutput> </strong>
</font></p>
<font face="Arial" size="1"><p>Your order for <cfoutput>#qty#</cfoutput>xxx has been successfully received.</p>
<p>If your order is received by 2PM (ET) they will ship the same day!</p>
<p>Questions or Comments? Please call us at 1-877-mmprint or 516-334-1603 or email info#mmprint.com </p></font>
<table border="1" bordercolor="##660000" cellpadding="2" cellspacing="0">
<tr>
<td><h2>Shipping Information:</h2></td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Company Name:</td><td align="left" valign="top">#form.coname#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">First Name:</td><td align="left" valign="top">#form.fname#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Last Name:</td><td align="left" valign="top">#form.lname#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Address:</td><td align="left" valign="top">#form.address#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Address 2:</td><td align="left" valign="top">#form.address2#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">City:</td><td align="left" valign="top">#form.city#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">State:</td><td align="left" valign="top">#form.state#</td>
</tr>
<tr>
<td bgcolor="##CCCCCC" align="left" valign="top">Zip:</td><td align="left" valign="top">#form.zip#</td>
</tr>
</table>
</cfmail>
<cflocation url="thanks.cfm?name=#form.bfname#" addtoken="no">
HERE IS THE FORM ITSELF:
<form action="process.cfm" id="blank-form" method="post" class="vertical">
<div class="col_4 ">
<fieldset>
<legend>Choose Your Quantity:</legend>
<p>
<select id="qty" name="qty" size="4" data-validation="required" data-validation-error-msg="Please Select a Quantity." >
<option value="100 Blank">100 - Blank CMS 1500 </option>
<option value="250 Blank">250 - Blank CMS 1500 </option>
<option value="500 Blank ">500 - Blank CMS 1500 </option>
<option value="1000 Blank">1000 - Blank CMS 1500 </option>
</select>
</p> <div style="font-size:0.7em; text-align:right;">*plus shipping and handling</div>
</fieldset>
<!-- CREDIT CARD -->
<fieldset>
<legend><i class="icon-lock"></i> Payment Information </legend>
<label for="cctype">Type</label>
<select id="cctype" name="cctype" data-validation="required">
<option value="VISA">VISA</option>
<option value="MC">Mastercard</option>
<option value="AMEX">AMEX</option>
<option value="DISC">Discover</option>
</select>
<label for="ccnumber">Credit Card Number</label>
<input type="text" id="ccnumber" name="ccnumber" data-validation="number" data-validation-error-msg="Please Enter a Valid Credit Card Number." >
<div class="col_5"> <label for="ccmonth">Expiration</label>
<select name="ccmonth" id="ccmonth" data-validation="required">
<option value = "1">January</option>
<option value = "2">February</option>
<option value = "3">March</option>
<option value = "4">April</option>
<option value = "5">May</option>
<option value = "6">June</option>
<option value = "7">July</option>
<option value = "8">August</option>
<option value = "9">September</option>
<option value = "10">October</option>
<option value = "11">November</option>
<option value = "12">December</option>
</select></div>
<div class="col_4"> <label for="ccyear">Year</label>
<select name="ccyear" id="ccyear" data-validation="required">
<option value = "2014" >2014</option>
<option value = "2015">2015</option>
<option value = "2016">2016</option>
<option value = "2017">2017</option>
<option value = "2018">2018</option>
<option value = "2019">2019</option>
<option value = "2020">2020</option>
</select></div>
<div class="col_3"><label for="csv" >CSV #</label>
<input type="text" name="csv" id="csv" data-validation="required" data-validation-error-msg=" "></div>
</fieldset>
<fieldset><legend>Email & Phone</legend>
<input type="text" placeholder="your#email.com" name="email" id="email" data-validation="email" data-validation-error-msg="Please enter a valid email where you can receive your order confirmation.">
<input type="text" placeholder="555-505-5050" name="phone" id="phone" data-validation="number" data-validation-error-msg="Please enter a phone number where we can contact you."></fieldset>
</div>
<div class="col_4">
<fieldset>
<legend>Billing Information</legend>
<p><input type="checkbox" id="sameasbilling"> Ship to Same As Billing Address</p>
<label for="bconame">Company Name</label>
<input type="text" id="bconame" name="bconame" minlength="2"/>
<label for="bfname">First Name</label>
<input type="text" id="bfname" name="bfname" minlength="2" data-validation="required"/>
<label for="blname">Last Name</label>
<input type="text" id="blname" name="blname" minlength="2" data-validation="required"/>
<label for="baddress">Address</label>
<input type="text" id="baddress" name="baddress" minlength="2" data-validation="required"/>
<label for="baddress2">Suite/Apt #</label>
<input type="text" id="baddress2" name="baddress2" />
<label for="bcity">City</label>
<input type="text" id="bcity" name="bcity" data-validation="required" />
<label for="bstate">State</label>
<input type="text" id="bstate" name="bstate" minlength="2" data-validation="required" />
<label for="bzip">Zip</label>
<input type="text" id="bzip" name="bzip" minlength="5" data-validation="required"/>
</fieldset>
</div>
<div class="col_4" id="shipping">
<fieldset>
<legend>Shipping Information</legend><br><br>
<label for="coname">Company Name</label>
<input type="text" id="coname" name="coname" minlength="2" />
<label for="fname">First Name</label>
<input type="text" id="fname" name="fname" minlength="2" data-validation="required"/>
<label for="lname">Last Name</label>
<input type="text" id="lname" name="lname" minlength="2" data-validation="required" />
<label for="address">Address</label>
<input type="text" id="address" name="address" minlength="2" data-validation="required"/>
<label for="address2">Suite/Apt #</label>
<input type="text" id="address2" name="address2" />
<label for="city">City</label>
<input type="text" id="city" name="city" data-validation="required"/>
<label for="state">State</label>
<input type="text" id="state" name="state" minlength="2" data-validation="required"/>
<label for="zip">Zip</label>
<input type="text" id="zip" name="zip" minlength="5" data-validation="required" />
</fieldset>
</div>
<div class="row">
<fieldset>
<legend>Comments | Special Instructions</legend>
<textarea id="comments" name="comments"></textarea>
<div class="right">
<button class="pop orange">Send the order!</button></div>
</form>
THE JQUERY:
<script>
$(document).ready(function() {
$('#sameasbilling').change(function(){
if ($('#sameasbilling').is(':checked')){
$('#shipping :input').addClass('disabled').prop('disabled', true).attr("value","Same As Billing");
} else {
$('#shipping :input').removeClass('disabled').prop('disabled', false).removeAttr("value");
}
});
$.validate();
})
</script>
I figured out that I can simply use
<cfparam name="form.name" default = "Default text">
to replace the missing fields when the form is processed.
I only accept this solution because my form is short. I'm sure there is a better way to do this for bigger forms that handle lots of data.
Hope this will help someone else.