AJAX function doesn't fire from button input form


J

jr

I want the AJAX printFromHere() script to fire when the user clicks
the
'print the current page' button.
It doesn't fire now? I don't know if I need another event besides
onClick? This is what I have in the form but it doesn't work.
I would really like it if the xmlhttp response text came back in the
printer response div. I enclose the View Source with the print this
button at the close of this post.
I have enclosed the view source with the javascript function
printFromHere. The button "print this page" input with the call to
the function
is the very last line.

I would also like to know how to get the xmlhttp response to return to
the div id='response_text' below that button input.
thanks,


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
<html>
<head>
<title>Print Barcode Labels</title>
<script type="text/javascript">
function printFromHere(){

var xhr = document.forms[0].search_zonenm.value;
if ( window.XMLHttpRequest ) {// code for IE7+,
Firefox, Chrome, Opera, Safari
xhr=new XMLHttpRequest();
}else{ // code for IE6, IE5
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4)
{
if(xhr.status == 200)

document.getElementById.printer_response="Received:" +
xhr.responseText;
else
document.getElementById.printer_response ="Error code
" + xhr.status;
}
}
xhr.open(GET, "print_test.php", true);
xhr.send(null);
}
</script>


</head>
<body>

<h2 align='center'>Print Bar Code Labels</h2>
<form action='/tools/XXXXX/print_labels_form5.php' onsubmit1='return
checkscript();' method='post'><a href='admin.php'>Admin Menu<a/><br>
PAGE: 350<table align='center' style='border:1px solid ;'>
<tr><th align='right'>BU</th>
</tr><tr><td><select
name='search_bu'id='search_bu'onChange='fillZoneNm();'>
<option value=''>Select BU</option>
<option value='08132' SELECTED>081</option>
<option value='08136' >082</option>
</select>
</td></tr><tr>
<th align='right'>Zone Number</th>
<td><div id='search_zonenm'>
<select name='search_zonenm' id='search_zonenm'>
<option value=''>Select Zone Number</option>
<option value='BIRTH CONTROL' >BIRTH CONTROL</option>
<option value='CIIIS' >CIIIS</option>

</select>
</td></tr><tr>
<th align='right'>Zone ID</th>
<td><input type'text' name='search_zoneid' id='search_zoneid' size='9'
class='txt1'></td>
</tr>
<tr><td colspan='13' align='center'><input type='submit'
name='submit1' value='Search'></td>
</tr></table>
No of Records: 1746

<th>Location
<th>Zone<br /> Number
<th>Zone<br /> ID
<th>NDC
<th>Item ID
<th>Description
<th>UPCK
<th>NDC<br />UOM
</tr>
<tr><tr class='gry'>
<td style='border:solid black 1px;padding:5px;'>08132
<td style='border:solid black 1px;padding:5px;'>Downey
<td style='border:solid black 1px;padding:5px;'>SYRINGES
<td style='border:solid black 1px;padding:5px;'>0221
<td style='border:solid black 1px;padding:5px;'>00193288021
<td style='border:solid black 1px;padding:5px;'>00193288021
<td style='border:solid black 1px;padding:5px;'>KETOSTIX REAGENT NFRS
STRIP 100/BX
<td style='border:solid black 1px;padding:5px;'>
<td style='border:solid black 1px;padding:5px;'>BX
</tr>
</table>
<table><tr><td>No Pages: 350 <br /><a href='/tools/cart_inventory/
print_labels_form5.php?page=1&bu=08132&zonenm=&zoneid='>1</a>
<a href='/tools/XXXX/print_labels_form5.php?
page=2&bu=08132&zonenm=&zoneid='>2</a>
<a href='/tools/XXXXX/print_labels_form5.php?
page=3&bu=08132&zonenm=&zoneid='>3</a>
<a href='/tools/XXXXX/print_labels_form5.php?
page=4&bu=08132&zonenm=&zoneid='>4</a>


<a
</td></tr></table><table><tr><td><div id='printbutton'><input
type="button" name="print" value="Print this page" id='printbutton'
onClick="printFromHere();"/></div></td></tr><tr><td><div
id='printer_response'></form></div></td></tr></table></form></body>
</html>
 
Ad

Advertisements

D

Denis McMahon

<script type="text/javascript">
function printFromHere(){

var xhr = document.forms[0].search_zonenm.value;
if ( window.XMLHttpRequest ) {// code for IE7+,
Firefox, Chrome, Opera, Safari
xhr=new XMLHttpRequest();
}else{ // code for IE6, IE5
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}

What is the purpose of xhr in your code? Is it to hold the
XMLHttpRequest object, or to hold the value of field
document.forms[0].search_zonenm.value?

See my earlier response to the original thread about this code for other
issues.

Rgds

Denis McMahon
 
D

David Mark

I want the AJAX printFromHere() script to fire  when the user clicks
the
'print the current page' button.

If you can't do that, you are getting way ahead of yourself with Ajax.
It doesn't fire now?

Doesn't it?
I don't know if I need another event besides
onClick?

This is what I'm talking about.
This is what I have in the form  but it doesn't work.
http://www.jibbering.com/faq/notes/posting/#ps1DontWork

I would really like it if the xmlhttp response text came back in the
printer response div.

People in hell want ice water. This is not a help desk.
I enclose the View Source with the print this
button at the close of this post.
I have enclosed the view source with the javascript function
printFromHere.

Well, that's good of you.
The button "print this page" input with the call to
the function
is the very last line.

I would also like to know how to get the xmlhttp response to return to
the div id='response_text'  below that button input.
thanks,

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

Why are you using XHTML when IE doesn't support it? Clearly you are
relying on error correction to turn it into HTML. That's not a sound
strategy (despite its inexplicable popularity).

Also, what are you transitioning from? And why are you transitioning
to a language that died on the Web almost a decade ago?
<html>
<head>
<title>Print Barcode Labels</title>
<script type="text/javascript">
function printFromHere(){

var xhr = document.forms[0].search_zonenm.value;

Never do that. Use the - elements - property of the form object.
                if ( window.XMLHttpRequest ) {// code forIE7+,
Firefox, Chrome, Opera, Safari
                  xhr=new XMLHttpRequest();
                }else{ // code for IE6, IE5
                  xhr=new ActiveXObject("Microsoft.XMLHTTP");
                }

Object inference. It should be clear from the comments that this is
another form of browser sniffing. Don't write scripts based on
observing a handful of today's browsers, else you'll be rewriting them
in perpetuity (see jQuery, Dojo, YUI, Ext JS, etc.)

http://www.jibbering.com/faq/notes/detect-browser/#bdOI
    xhr.onreadystatechange  = function()
    {
         if(xhr.readyState  == 4)
         {
              if(xhr.status  == 200)

document.getElementById.printer_response="Received:"  +
xhr.responseText;

Well, this might just be your lucky day as I sure as hell wasn't going
to wade through the whole thing.

What's wrong with that picture? You are clearly just rearranging
patterns here. Where have you seen such a pattern?

I suppose now that the likely suspect has been pointed out, perhaps
some enabler will come along and gift-wrap the answer. I hope not as
this is how library authors are born. :(
 
T

Thomas 'PointedEars' Lahn

David said:
Why are you using XHTML when IE doesn't support it? Clearly you are
relying on error correction to turn it into HTML.

That assumption cannot be made from the posting.
That's not a sound strategy (despite its inexplicable popularity).

Non sequitur.
Also, what are you transitioning from?

Since XHTML 1.0 is "a reformulation of HTML 4 in XML 1.0"¹, XHTML 1.0
Transitional (instead of Strict) needs to be declared if one wants to
declare and use XHTML, and use features that were (prematurely) deprecated
by HTML 4.01, such as the `target' attribute and the `iframe' element.
And why are you transitioning to a language that died on the Web almost a
decade ago?

I wished people would stop perpetuating this legend. That many people do
not know how to use XHTML properly or do not know about the advantages that
XHTML can provide does not make the language dead.²


PointedEars
___________
¹ <http://www.w3.org/TR/xhtml1/>
² <<--
var bugRiddenCrashPronePieceOfJunk = (
navigator.userAgent.indexOf('MSIE 5') != -1
&& navigator.userAgent.indexOf('Mac') != -1
) // Plone, register_function.js:16
 
D

David Mark

That assumption cannot be made from the posting.

LOL. You really think this "jr" guy is using XML parse mode?
Furthermore, on the entire Web, I know of exactly one document that
creates an XHTML DOM. My XHTML Build Test page.

Again, what would be the point as IE (< 9) anyway does not support
it. It's been a dead issue almost from the start on the Web.

Not only that, but you are flat-out wrong about the context of this
posting. The posted markup is not going to work in XML parse mode.
Non sequitur.
Non-sense.


Since XHTML 1.0 is "a reformulation of HTML 4 in XML 1.0"¹, XHTML 1.0
Transitional (instead of Strict) needs to be declared if one wants to
declare and use XHTML, and use features that were (prematurely) deprecated
by HTML 4.01, such as the `target' attribute and the `iframe' element.

No kidding. But see above.
I wished people would stop perpetuating this legend.

And how many sites on the Web do you know of that use XML parse mode?
That many people do
not know how to use XHTML properly or do not know about the advantages that
XHTML can provide does not make the language dead.²

It's a stiff. Bereft of life, it rests in peace. :)

And please stop confusing the newcomers.
 
D

David Mark

LOL.  You really think this "jr" guy is using XML parse mode?
Furthermore, on the entire Web, I know of exactly one document that
creates an XHTML DOM.  My XHTML Build Test page.

Again, what would be the point as IE (< 9) anyway does not support
it.  It's been a dead issue almost from the start on the Web.

Not only that, but you are flat-out wrong about the context of this
posting.  The posted markup is not going to work in XML parse mode.

And neither would the script.

As is often the case with "XHTML" documents found on the Web, any hope
of "future proofing" (for a dead language no less) is lost due to
scripts that would never work reliably in XHTML DOM's.

To wit:-

var xhr = document.forms[0].search_zonenm.value
 
Ad

Advertisements

J

jr

<script type="text/javascript">
function printFromHere(){
var xhr = document.forms[0].search_zonenm.value;
                if ( window.XMLHttpRequest ) {// code for IE7+,
Firefox, Chrome, Opera, Safari
             xhr=new XMLHttpRequest();
           }else{ // code for IE6, IE5
             xhr=new ActiveXObject("Microsoft.XMLHTTP");
           }

What is the purpose of xhr in your code? Is it to hold the
XMLHttpRequest object, or to hold the value of field
document.forms[0].search_zonenm.value?

See my earlier response to the original thread about this code for other
issues.

Rgds

Denis McMahon
xhr is needed to check the value of the readystate, right?
I did change it from assigning the printer_response to the
responseText to the innerHTML of the getElementByID function. thanks,
document.getElementById('printer_response').innerHTML="Received:" +
xhr.responseText;
 
D

Denis McMahon

<script type="text/javascript">
function printFromHere(){
var xhr = document.forms[0].search_zonenm.value;
if ( window.XMLHttpRequest ) {// code for IE7+,
Firefox, Chrome, Opera, Safari
xhr=new XMLHttpRequest();
}else{ // code for IE6, IE5
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}

What is the purpose of xhr in your code? Is it to hold the
XMLHttpRequest object, or to hold the value of field
document.forms[0].search_zonenm.value?

See my earlier response to the original thread about this code for other
issues.
xhr is needed to check the value of the readystate, right?
I did change it from assigning the printer_response to the
responseText to the innerHTML of the getElementByID function. thanks,
document.getElementById('printer_response').innerHTML="Received:" +
xhr.responseText;

An object to handle the data exchange is needed, yes, but it doesn't
have to be called any specific name.

Let me clarify my earlier question:

First you do this:
var xhr = document.forms[0].search_zonenm.value;

which assigns some value from a form field to the variable "xhr"

Then you do this:

which assigns your data exchange object to "xhr"

Now, which one of these two is xhr meant to be, and whichever one it is,
what is the correct name of the variable that you wish to assign to the
other one.

For all the regulars, how long before jr asks for help in working out
why xhr doesn't contain a string representing
"document.forms[0].search_zonenm.value"?

Rgds

Denis McMahon
 
C

Captain Paralytic

LOL.  You really think this "jr" guy is using XML parse mode?
This jr guy is a girl. Janis or Jane Rough.

She has been trying to program for 10 years and still can't master the
basics.

Check out her posting profile in Google groups and you'll see what I
mean.
 
D

David Mark

<snip>

In the event that this document is being interpreted as XHTML by the
browser, the:-

| <input type="button" ... onClick="printFromHere();"/>
                           ^^^^^^^
- in the mark-up is sufficient to explain why clicking the button is not
resulting in any apparent action.

It's a gEBI snafu from the bit of code I looked at. At a glance, I
don't think his markup would even parse as XHTML.
However, that does suggest a reliance on the document being interpreted
as HTML (and so error corrected), but possibly a reliance that is
disappointed by the document actually being interpreted as XHTML.

That would be another possibility, but I think it is less than a
favorite in this case.
 
D

David Mark

This jr guy is a girl. Janis or Jane Rough.

Mea culpa. I must have mistaken her for another "JR" (or "jr"). Hard
to tell with such non-specific handles.
She has been trying to program for 10 years and still can't master the
basics.

I'm sorry to hear that. I thought she was an absolute beginner.
Check out her posting profile in Google groups and you'll see what I
mean.

I'll pass. :)
 
Ad

Advertisements

J

jr

Mea culpa.  I must have mistaken her for another "JR" (or "jr").  Hard
to tell with such non-specific handles.




I'm sorry to hear that.  I thought she was an absolute beginner.




I'll pass.

Excuse me but CP is incorrect. I was doing Filemaker databases for 10
years. That is not programming.
 
J

jr

Mea culpa.  I must have mistaken her for another "JR" (or "jr").  Hard
to tell with such non-specific handles.




I'm sorry to hear that.  I thought she was an absolute beginner.




I'll pass.  :)
 
J

jr

This jr guy is a girl. Janis or Jane Rough.

She has been trying to program for 10 years and still can't master the
basics.

Check out her posting profile in Google groups and you'll see what I
mean.

YOu could take 10 years to learn something if you only did it once a
year for a few weeks.
It does not mean I was doing it every day for 10 years or for even
most of the last 10 years
Yes I'm trying to learn something new. You have no idea what you are
saying.
 
J

jr

On 01/08/10 05:04, jr wrote:
<script type="text/javascript">
function printFromHere(){
var xhr = document.forms[0].search_zonenm.value;
                if ( window.XMLHttpRequest ) {// codefor IE7+,
Firefox, Chrome, Opera, Safari
             xhr=new XMLHttpRequest();
           }else{ // code for IE6, IE5
             xhr=new ActiveXObject("Microsoft.XMLHTTP");
           }
What is the purpose of xhr in your code? Is it to hold the
XMLHttpRequest object, or to hold the value of field
document.forms[0].search_zonenm.value?
See my earlier response to the original thread about this code for other
issues.
xhr is needed to check the value of the readystate, right?
I did change it from assigning the printer_response to the
responseText to the innerHTML of the getElementByID function.  thanks,
 document.getElementById('printer_response').innerHTML="Received:"  +
xhr.responseText;

An object to handle the data exchange is needed, yes, but it doesn't
have to be called any specific name.

Let me clarify my earlier question:

First you do this:
var xhr = document.forms[0].search_zonenm.value;

which assigns some value from a form field to the variable "xhr"

Then you do this:

which assigns your data exchange object to "xhr"

Now, which one of these two is xhr meant to be, and whichever one it is,
what is the correct name of the variable that you wish to assign to the
other one.

For all the regulars, how long before jr asks for help in working out
why xhr doesn't contain a string representing
"document.forms[0].search_zonenm.value"?

Rgds

Denis McMahon

I apologize, I left that first var xhr there in error because I was
trying to figure out how to get var $response back to
the display page from the print_test.php page. How do I go about
that or does that have to be another XMLHTTPrequest ? Maybe that is a
question for the php usenet group?
So I get a respose from the FTP printer, which says FTP connected or
FTP failed, that is a var fromthe printer_test.php page. It would be
great if I could get that response and display it to the user in the
<div> id="printer_response" <div>.

Here is the function
function printFromHere(){

var response ;

if ( window.XMLHttpRequest ) {// code for IE7+,
Firefox, Chrome, Opera, Safari
xhr=new XMLHttpRequest();
}else{ // code for IE6, IE5
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4)
{
if(xhr.status == 200)

document.getElementById('printer_response').innerHTML="Received:" +
xhr.responseText;
else
document.getElementById('printer_response').innerHTML
="Error code " + xhr.status;
}
}
xhr.open(GET, "print_test.php", true);
xhr.send(null);
}


This is the submit button in the form,

<input type="submit" name="print" value="Print labels on this page"
onsubmit="printFromHere();"/></form></body>
</html>
Rgds,
Janis
 
Ad

Advertisements

J

jr

It's a gEBI snafu from the bit of code I looked at.  At a glance, I
don't think his markup would even parse as XHTML.




That would be another possibility, but I think it is less than a
favorite in this case.
P.S. I don't need to exchange any GET or POST data in this case with
the print_test.php page. I only need to print the labels on this page.
The data is written to a template text file. That file is FTP'd to a
zebra printer when the print_test.php page is called. I would like
some information on the handshake.
The AJAX just allows the user to click the button for all the pages
from the display page and not have to keep clicking the back button
from the print_test.php page.
There are pages and pages of labels. So what I really want to do is
to call the print_test.php that FTPs the template text file from
the display page. If I get a status 200 that should let me know the
page got called but I really need the $response var from that page to
be passed back to the display page. Right now what is happening when
I click the button is it eliminates the current data displayed and
only gives me the empty form?
 
D

Denis McMahon

This is the submit button in the form,

<input type="submit" name="print" value="Print labels on this page"
onsubmit="printFromHere();"/>

Is "onsubmit" a valid event for an object of type submit? I thought it
was a form event.

I'm not sure whether you want to submit data from this form to the php
page that triggers the print operation or not. Clarification of that
might help. If you do, then to use an ajax request, you will have to use
javascript to assemble a full post or get request from the form data
when the button is clicked. It may be better to use a traditional form
submit and generate a new page with the printer response message on the
server.

If the data is already on the server, you don't need to use a form for
this, although how does the server know which data to use? Session
cookies? Job id from the form (which you might need to append to the get
request using ?field=value)? In either case, you probably shouldn't be
triggering ajax requests from a form's submit button using an onsubmit
handler.

You could use the form's onsubmit handler to specify javascript to
execute when the submit button is pressed. Perhaps that's what you want
to do? If you do that, and don't want to execute the form's action, make
sure your javascript returns false.

Your submit button is probably trying to call it's parent form's action,
unless your "onsubmit='blah'" is confusing it completely.

Perhaps you should use a normal button (rather than a submit) and give
it a value of, for example, "Send to Printer" and, perhaps, use an
appropriate event handler to call the javascript code.

If I had a better understanding of what you were attempting, I might be
able to give better and / or less confusing pointers to possible solutions.

The following javascript and html, if you understand what it shows,
might be useful to you, or it might not. If you don't understand it, but
instead just blindly copy parts, or all, of it, and things still don't
work, well you obviously didn't take the time to try and understand it
first!

<script type="text/javascript">
function clanger() {
// visit the soupdragon
var soupdragon;
if (window.XMLHttpRequest) { // ie7+ etc
soupdragon=new XMLHttpRequest();
}else{ // IE6, IE5
soupdragon=new ActiveXObject("Microsoft.XMLHTTP");
}
soupdragon.onreadystatechange = function()
{
if(soupdragon.readyState == 4)
{
if(soupdragon.status == 200)
document.getElementById('printer_response').innerHTML=
"Received: " + soupdragon.responseText;
else
document.getElementById('printer_response').innerHTML=
"Error code: " + soupdragon.status;
}
}
soupdragon.open(GET, "print_test.php", true);
soupdragon.send();
return false;
}
</script>

<form action="blah" method="whatever" onsubmit="clanger()">
...... fields .....
<input type="submit">
</form>

Rgds

Denis McMahon
 
Ad

Advertisements

D

David Mark

Filemaker is not a programming language.   I feel like the statements
he is making about me are false.

Ah, I see what you are saying now. And yes, I tend to agree with you
on that point.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top