Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Oct 2012
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    combine results from sql query and javascript to calculate a field

    I am very new to JavaScript, Have a problem regarding arrays within javascript. Straight to the point: I have HTML code:

    Code:
    <input type="text" name="conPrice" id="conPrice" size="16" maxlength="128"/>
    <input type="text" name="OverP" id="OverP" size="16" maxlength="128"  />
    <div id="slider"></div> //Slider
    First field for quantity, that is pulled from slider. Second field for price from SQL table

    SQL is based on a condition that there is four fields:

    Code:
    | ID | MIN | MAX | PRICE |
    I am trying to get a price column prices in field OverP depending on what my sliders value is. so, if for example I have number 6 on a slider and it is between 1-7 as MIN and MAX, so the price would be 10.

    I have this SQL:

    PHP Code:
    <?php
    $x 
    mysql_query("SELECT p_max AS max FROM dsd_price");
    $y mysql_query("SELECT p_min AS min FROM dsd_price");
    $z mysql_query("SELECT p_price AS price FROM dsd_price");
    while (
    $x_array mysql_fetch_array($x)){$max[] = $x_array;}
    while (
    $y_array mysql_fetch_array($y)){$min[] = $y_array;}
    while (
    $z_array mysql_fetch_array($z)){$price[] = $z_array;}
    ?>
    And finally my JS:

    Code:
    <script>
    $(document).ready(function slider() {
    $( "#slider" ).slider({
        value:1,
        min: 0,
        max: 201,
        step: 1,
        slide: function( event, ui ) {
    //Its setting the slider value to the element with id "conPrice" 
    $("#conPrice" ).val(ui.value);
        }
    });
    });
    
    $(document).ready(function calcul() {
    var frm = document.dsd_form;
    var quant = frm.conPrice;
    var overp = ['<?php echo implode("','", $price); ?>'];
    var mini = ['<?php echo implode("','", $min); ?>'];
    var maxi = ['<?php echo implode("','", $max); ?>'];
    for(index = 0; quant > mini[index], quant < maxi[index]; index++){
        $( "#OverP" ).val( overp[index] );
    })
    }   
    </script>
    I am not getting a result I wish, I know that the problem is with my JS. Hope for some suggestions to my topic as soon as possible.

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,096
    Thanks
    23
    Thanked 594 Times in 593 Posts
    You should only have one $(document).ready() statement. This may or may not correct your problem, but this is how to combine your jquery stuff. If still not working we can go from there:
    Code:
    <script type='text/javascript' src='javascript/jquery.js'></script> // where mine is located.. Yours is probably in different location
    <script type="text/javascript">
    $(document).ready(function() {
    	$("#slider" ).slider({
    	    value:1,
    	    min: 0,
    	    max: 201,
    	    step: 1,
    	    slide: function( event, ui ) {
    	//Its setting the slider value to the element with id "conPrice" 
    	$("#conPrice" ).val(ui.value);
    	    }
    	});
    	
    	function calcul(){
    		var frm = document.dsd_form;
    		var quant = frm.conPrice;
    		var overp = ['<?php echo implode("','", $price); ?>'];
    		var mini = ['<?php echo implode("','", $min); ?>'];
    		var maxi = ['<?php echo implode("','", $max); ?>'];
    		for(index = 0; quant > mini[index], quant < maxi[index]; index++)
    		{
    		    $( "#OverP" ).val( overp[index] );
    		}
    	}	
    	
    });
    </script>

  • #3
    New to the CF scene
    Join Date
    Oct 2012
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi again, taking off
    Code:
    $(document).ready
    had some positive effects, now I can actually see my slider and a value of conPrice is changing according to slider, although second function seems not to work completely.

  • #4
    New to the CF scene
    Join Date
    Oct 2012
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Putting in whole code of the test page so far. slider does slide, the slider value is being processed to conPrice, but calculation does not work...

    Code:
    <script src="jquery.js" type="text/javascript" charset="utf-8"></script>
    <!-- For slider -->
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
    
    <!-- Slider JS -->
    <?php
    $x = mysql_query("SELECT p_max AS max FROM dsd_price");
    $y = mysql_query("SELECT p_min AS min FROM dsd_price");
    $z = mysql_query("SELECT p_price AS price FROM dsd_price");
    while ($x_array = mysql_fetch_array($x)){$max[] = $x_array['max'];}
    while ($y_array = mysql_fetch_array($y)){$min[] = $y_array['min'];}
    while ($z_array = mysql_fetch_array($z)){$price[] = $z_array['price'];}
    ?>
    <script>
    $(document).ready(function slider() {
    $( "#slider" ).slider({
        value:1,
        min: 0,
        max: 201,
        step: 1,
        slide: function( event, ui ) {
      //Its setting the slider value to the element with id "conPrice" 
      $("#conPrice" ).val(ui.value);
        }
     });
        function price(){
        var frm = document.dsd_form;
        var quant = frm.conPrice;
        var overp = ['<?php echo implode("','", $price); ?>'];
        var mini = ['<?php echo implode("','", $min); ?>'];
        var maxi = ['<?php echo implode("','", $max); ?>'];
        for(var index = 0; quant > mini[index], quant < maxi[index]; index++){
            $( "#OverP" ).val( overp[index] );
        }
    }
    });
    </script>
    </head>
    <body>
    <form id="dsd_form" name="dsd_form" action="db_create_sql.php" method="post" class="niceform">
    <fieldset>
           <dl>
                <dt><label for="conPrice">Price:</label></dt>
                <dd><input type="text" name="conPrice" id="conPrice" size="16" maxlength="128" />
                <input type="text" name="OverP" id="OverP" size="16" maxlength="128" />
                <div id="slider" ></div>
                </dd>
            </dl>
    </fieldset>
    </form>
    </body>
    </html>
    Having SQL database:

    Code:
     p_id | p_min | p_max | p_price
      1        1      1       11
      2        2      5       13

  • #5
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    Code:
    <script src="jquery.js" type="text/javascript" charset="utf-8"></script>
    <!-- For slider -->
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
    You are loading two (possibly three) versions of the jquery library and two versions of the jquery-ui library; you should only have one of each.
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • #6
    New to the CF scene
    Join Date
    Oct 2012
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    even though I cut out most of them, it still appears not working...more suggestions?

    Code:
    <script src="jquery.js" type="text/javascript" charset="utf-8"></script>
    <!-- For slider -->
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •