Javascript

capitan · 9 Φεβρουαρίου 2010

Μπορεί κάποιος να με βοηθήσει με τον παρακάτω κώδικα? Δε μπορώ να καταλάβω γιατί δε δουλεύει

><form name="amount_form" method="post" onsubmit="javascript: return checkQuantity(document.getElementById('pr<%=i%>_amount').value);" action="Controller?event=Update_Basket&productId=<%= pb.getSerial() %>">
<label for="pr<%=i%>_amount">Amount: </label><input onchange="javascript:this.form.submit()" type="text" style="width:20px" value="<%= ((BasketObject)bol.get(i)).getQuantity() %>" name="quantity" id="pr<%=i%>_amount">
</form>

Το πρόβλημα είναι ότι δεν μπαίνει καν μέσα στην checkQuantity() αλλά μπαίνει στο servlet Controller. Δηλαδή το onsubmit είναι σα να μην υπάρχει. Υπάρχει λόγος να μην του αρέσει το onchange="javascript:this.form.submit()" ?

Ευχαριστώ

circadian · 9 Φεβρουαρίου 2010

firebug εχεις? δες μηπως πεταει καποιο error εκει. δοκιμασε χωρις το return πριν την checkQuantity

capitan · 9 Φεβρουαρίου 2010

δοκίμασα και με firebug αλλά δεν βγάζει κάτι στην console δυστυχώς...δοκίμασα και χωρίς το return αλλά τα ίδια. Ιδού και η javascript

>
function checkQuantity(q){
   if(q>0)
       return true;
   else{
       alert('Quantity must be positive');
       return false;
   }
}

Πηγαίνοντας το γραμμή γραμμή με το firebug, όταν αλλάξω το πεδίο amount, πηγαίνει στο αρχείο που έχω όλα τα scripts και ψάχνει συνάρτηση συνάρτηση να βρει τη σωστή, αλλά στη σωστή δε μπαίνει.

alex2005 · 10 Φεβρουαρίου 2010

Στείλε μας όλη την σελίδα σου, χωρίς τα jsp tags, όπως δηλαδή θα το λάβει ο browser.

Γενικότερα για να πάρεις σωστή απάντηση πρέπει να δίνεις κάτι έτσι ώστε να μπορούμε να αναπαράγουμε το πρόβλημα.

Uberalles_gr · 10 Φεβρουαρίου 2010

Θα σου πρότεινα στο onchange που θες να κάνεις να φωνάζεις μία συνάρτηση και να κάνεις ένα alert αρχικά.

Εάν δουλέψει σωστά το alert μετά πετάς και ένα document.form_name.submit() και είσαι έτοιμος

capitan · 10 Φεβρουαρίου 2010

ολόκληρη η σελίδα που βγάζει το jsp

><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html>
   <head>
       <meta name="keywords" content="buy,computers,electronics">

       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
       <title>E-lectronics online store</title>
       <link rel="stylesheet" type="text/css" href="css/stdstyle.css" />

       <script type="text/javascript" src="common.js"></script>

       <script type="text/javascript">
           function debug(id){
               var sel = document.getElementById(id);
               alert(sel.getAttribute('bgcolor'));
               return;
           }
       </script>

   </head>

   <body>
       <div class="main">
<a href="Controller?event=Show_Homes"><img src="pics/label.gif" width=1000px height=110px alt="e-lectronics" border="1px" style="border-color:black"></a>
<table class="main_menu">
   
   <tr>
       <td class="main_menu" align="center"><a class="main_menu" title="Back to homepage" href="Controller?event=Show_Homes">Home</a></td>
       <td class="main_menu" align="center"><a class="main_menu" href="Controller?event=Show_Basket">My Basket</a></td>
       <td class="main_menu" align="right"><table cellpadding="0px"><tr><td><form action="" method="get" name="searchForm" onSubmit="return basicCheck(document.searchForm.searchText.value)">

                           <input type="text" value="Search" name="searchText">
                           <input type="submit" value="GO" name="searchButton">
                       </form></td></tr><tr><td  style="font-size:10px"><a class="main_menu" href="advanced_search.html">Advanced search</a> </td></tr></table></td>
   </tr>
   
</table>
           <hr>

           <table width="100%">
               <tr>
                   <td valign="top">
                       <!--Left section-->
<table class="main_x">
   <thead>
       <tr>
           <td class="side_section_headers">Select category</td>

       </tr>
   </thead>
   <tr>
       <td style="font-size:14px">
           <table>
               
               <tr>
                   <td id="cat0" onmouseover="hoverIn('cat0')" onmouseout="hoverOut('cat0')"><a href="Controller?event=Show_Category&category=All">All</a></td></tr>
                   
               <tr>

                   <td id="cat1" onmouseover="hoverIn('cat1')" onmouseout="hoverOut('cat1')"><a href="Controller?event=Show_Category&category=Cameras">Cameras</a></td></tr>
                   
               <tr>
                   <td id="cat2" onmouseover="hoverIn('cat2')" onmouseout="hoverOut('cat2')"><a href="Controller?event=Show_Category&category=Computer Parts">Computer Parts</a></td></tr>
                   
               <tr>
                   <td id="cat3" onmouseover="hoverIn('cat3')" onmouseout="hoverOut('cat3')"><a href="Controller?event=Show_Category&category=Computers">Computers</a></td></tr>
                   
               <tr>
                   <td id="cat4" onmouseover="hoverIn('cat4')" onmouseout="hoverOut('cat4')"><a href="Controller?event=Show_Category&category=Games">Games</a></td></tr>

                   
               <tr>
                   <td id="cat5" onmouseover="hoverIn('cat5')" onmouseout="hoverOut('cat5')"><a href="Controller?event=Show_Category&category=Monitors">Monitors</a></td></tr>
                   
               <tr>
                   <td id="cat6" onmouseover="hoverIn('cat6')" onmouseout="hoverOut('cat6')"><a href="Controller?event=Show_Category&category=Software">Software</a></td></tr>
                   
               <tr>
                   <td id="cat7" onmouseover="hoverIn('cat7')" onmouseout="hoverOut('cat7')"><a href="Controller?event=Show_Category&category=TVs">TVs</a></td></tr>
                   
           </table>

       </td>
   </tr>
</table>

                   </td>
                   <td valign="top">
                       <div style="float:left">
                           <a href="home.html">Home</a>><a href="mybasket.html">My basket</a>

                       </div>
                       


<div style="float:right">
   <span>Welcome, <i>Guest</i></span>   
   
</div>

                       <!--Center section-->
                       <script type="rext/javascript">var myform = document.amount_form;
                       var myform2 = document.amount_form;</script>
                       <table class="main_x" width="735px">

                           <tr><th><h2>My Basket</h2></th></tr>
                           
                           <tr>
                               <td>
                                   <table class="products_section" rules="rows" cellpadding="10px">
                                       
                                       <tr id="product0">
                                           <td><input type="checkbox" onclick="javascript:highlight('product0')"></td>
                                           <td class="product_pic" valign="top"><img src="pics/sapphire_hd_ 5870.jpg" alt="ATI Radeon 5870"></td>
                                           <td valign="top"><a href="Controller?event=Show_Product&productId=4">ATI Radeon 5870</a><br><b>Manufacturer: </b>Sapphire</td>

                                           <td valign="middle"><span style="color:green;font-size:14px;">In stock</span></td>
                                           <td align="right">Price: <span style="color:green;font-size:14px;"><b id="pr0_price">320.0</b></span> eur<br><form name="amount_form" method="post" onsubmit="javascript: return checkQuantity(document.getElementById('pr0_amount').value);" action="Controller?event=Update_Basket&productId=4"><label for="pr0_amount">Amount: </label><input onchange="javascript:this.form.submit()" type="text" style="width:20px" value="1" name="quantity" id="pr0_amount"></form> <a href="Controller?event=Delete_From_Basket&productId=4"><img title="Remove product from basket" src="pics/delete-icon.png" width="16" height="16" alt="delete-icon"/></a>
                                           </td>
                                       </tr>
                                       
                                   </table>

                               </td>
                           </tr>
                           <tr>
                               <td>
                                   <table width="100%"><tr><td><input type="button" onclick="callServlet('Controller?event=Empty_Basket')" value="Empty basket">&nbsp<input type="button" onclick="callServlet('Controller?event=Check_Compatibility')" value="Compatibility check"></td><td align="right">
                                   <span style="font-weight:bold;font-size:20px">Total cost:</span>     <span style="color:green;font-size:20px" id="totalcost">960.0 eur</span><br><br></td></tr></table></td>
                           </tr>
                           <tr><td align="right">

                                   <input type="button" onclick="javascript:callServlet('Controller?event=Save_Basket')" value="Save basket" style="font-size:16px"> <input type="button" value="Place order" style="font-size:16px;font-weight:bold" onclick="window.location='placeorder.html'">
                                           </td></tr>
                           
                           <tr><td><br></td></tr>
                       </table>

                   </td>
                   <td valign="top">
                       <!--Right section-->
                       



<table class="main_x">

   <tr>
       <td class="side_section_headers">Login here!</td>
   </tr>
   <tr>
       <td>
           <form name="loginForm" action="Controller?event=Login&lastpage=/boundary.views/index.jsp" method="post" onSubmit="return (basicCheck(document.loginForm.emailText.value) && basicCheck(document.loginForm.passwordText.value))">
               <input type="text" value="[email protected]" name="emailText" style="width:133px">
               <br>

               <input type="password" value="password" name="passwordText" style="width:133px">
               <br>
               <input type="submit" value="Login" name="loginButton">
               <span style="font-size:12px"><a href="register.jsp">Register</a></span>
           </form>
       </td>
   </tr>
</table>
<br>


                       <table class="main_x"><tr><td><img src="pics/digea.jpg" width="137" height="266" alt="digea"/>
           <br><br>
           <img src="pics/adv1.gif" width="137" alt="advertisement"/>
       </td></tr></table>

                   </td>
               </tr>
               <tr><td><br></td></tr>

               <tr><td width="100%" colspan="3">
<table class="footer" width="100%"><tr><td align="center" width="253"><a href="">Home</a></td><td align="center" width="253"><a href="">Contact Us</a></td><td align="center" width="253"><a href="">FAQ</a></td><td align="center" width="253"><a href="">Disclaimer</a></td></tr></table>
</td></tr>
           </table>


       </div>
   </body>
</html>

και το σημείο ενδιαφέροντος (τελευταία γραμμή πριν tr κ td)

><tr id="product0">
   <td><input type="checkbox" onclick="javascript:highlight('product0')"></td>
                                           <td class="product_pic" valign="top"><img src="pics/sapphire_hd_ 5870.jpg" alt="ATI Radeon 5870"></td>
                                           <td valign="top"><a href="Controller?event=Show_Product&productId=4">ATI Radeon 5870</a><br><b>Manufacturer: </b>Sapphire</td>

                                           <td valign="middle"><span style="color:green;font-size:14px;">In stock</span></td>
                                           <td align="right">Price: <span style="color:green;font-size:14px;"><b id="pr0_price">320.0</b></span> eur<br><form name="amount_form" method="post" onsubmit="javascript: return checkQuantity(document.getElementById('pr0_amount').value);" action="Controller?event=Update_Basket&productId=4"><label for="pr0_amount">Amount: </label><input onchange="javascript:this.form.submit()" type="text" style="width:20px" value="1" name="quantity" id="pr0_amount"></form><a href="Controller?event=Delete_From_Basket&productId=4"><img title="Remove product from basket" src="pics/delete-icon.png" width="16" height="16" alt="delete-icon"/></a>
                                           </td>
                                       </tr>

Το alert το πέταξε στο onchange κανονικά, όπως και το submit απ' ότι έχω καταλάβει το κάνει. Το θέμα μάλλον είναι ότι το onsubmit του form δεν ενεργοποιείται από το javascript submit...

Crawl_From_Death · 10 Φεβρουαρίου 2010

Αποσο ξερω το action σε μια φορμα υπερισχυει εναντι του onsubmit. Αρα αυττο σημαινει οτι δεν θα μπει στο onsubmit (δεν βαζω και το χερι μου στην φωτια...)

Το πιο σιγουρο που εχεις να κανεις ειναι το εξης:

- Στο onsubmit βαλε "return false;"

- Αφαιρεσε το action που εχει η φορμα.

- Στο κουμπι που πατας για να εκτελεσει τον ελεγχο και να κανει submit βαλε να ειναι τυπου button και οχι submit

- Στο κουμπι αυτο βαλε event onclick το οποιο θα τρεχει τον ελεγχο που θελεις να κανεις. Αν ειναι ολα ok και θελεις να προχωρησεις στο submit της φορμας θα του πεις οτι:

document.getElementById('IDTHSFORMAS').action='το_urt_που_8ελεις';

document.getElementById('IDTHSFORMAS').submit()

καλη επιτυχια

alex2005 · 10 Φεβρουαρίου 2010

Το πρόβλημα είναι πως όταν καλείς την form.submit() απευθείας δεν καλείται πρώτα η onsubmit. Σημείωσε πως αν βάλεις ένα submit button δουλεύει κανονικά.

Η αλήθεια είναι πως δεν υπάρχει λόγος να το κάνεις όπως το έχεις κάνει. Θα μπορούσες να κάνεις τον έλεγχο κατευθείαν στην onchange του input.

Οπότε

>
<input onchange="javascript:if (checkQuantity(document.amount_form.quantity.value))this.form.submit();" type="text" style="width:20px" value="1" name="quantity" id="pr0_amount">

capitan · 10 Φεβρουαρίου 2010

όντως...thanks alex2005. Σας ευχαριστώ παιδιά για τις απαντήσεις σας

Σύνδεση

Javascript

Προτεινόμενες αναρτήσεις

capitan

circadian

capitan

alex2005

Uberalles_gr

capitan

Crawl_From_Death

alex2005

capitan

Αρχειοθετημένο

Σύνδεση