使用分面搜索具有ajax调用的项目

时间:2014-08-14 17:11:51

标签: javascript php facet faceted-search nouislider

首先,感谢你们所有的帮助,这些帮助使我根本不需要提出任何问题!

我被困在我项目的这个特定部分;我有一个功能页面,它调用相关SQL表中的产品,使用ajax调用来填充适当的数据,并使用这些数据形成一个nouislider(参见http://refreshless.com/nouislider/)。然而,当我尝试通过分面搜索(根据http://eikes.github.io/facetedsearch/)搜索这些项目时,我不再显示我的nouislider(或ajax数据)。

这是功能代码的缩短版本,然后才会被刻面:

   <?php
require_once 'sqllogin.php';  

$connectionfortrending = new mysqli($db_hostname, $db_username, $db_password,         $db_database);

if ($connectionfortrending->connect_error) die($connectionfortrending->connect_error);

$querycalltrendingproducts = "SELECT * FROM products WHERE trending='1' LIMIT 1";
     $resultcalltrendingproducts = $connectionfortrending-    >query($querycalltrendingproducts);

if (!$resultcalltrendingproducts) die ("Database access failed: " . mysql_error());


      $alltrending = array();
while($rowstrending = mysqli_fetch_assoc($resultcalltrendingproducts)) 
 {
  $alltrending = array();
  $alltrending[] = $rowstrending;





?>

            <td>

<a href="<?php
    echo $alltrending[0]['productkey'];
        ?>.php"><img id="trending1" border="0" style="width:200px;height:250px" src=<?php
    echo $alltrending[0]['productimg'];
    ?>></a>
                <div class="infotext">
    <?php
  echo $alltrending[0]['productinfo'];         
    ?>
        </div>


      <?php
}

    ?>


        <div class="priceshower" style="display:inline;">&#163<span class="priceshower" style="display:inline;" id="pledgepriceviewtrend1" align="center"></span></div>

        <div style="margin-left:80px;" class="slider" id="trendingslider1"></div>




<script>
trendingslider1.noUiSlider({
start: [ tslider1v3 ],

range: {
    'min': [  tslider1v1 ],
    'max': [ tslider1v3 ]
},
        serialization: {
    lower: [

        $.Link({
            target: $("#pledgepriceviewtrend1")      
        }),

                    $.Link({
            target: $("#pledgepricesubmittrend1")      
        })

    ],

            format: {

        decimals: 2,

    }
}

});





function getGroupTrendingSlider1(){      

valuestr = $("#trendingslider1").val();   
valuenum = Number(valuestr);

  if (window.XMLHttpRequest) {
  // code for IE7+, Firefox, Chrome, Opera, Safari
 xmlhttp=new XMLHttpRequest();
  } else { // code for IE6, IE5
 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
  document.getElementById("pplleftingroup").innerHTML=xmlhttp.responseText;
   }
  }
xmlhttp.open("GET","posttrending1v3.php?q=",true);
</script>

我已尝试将整批(SQL调用和HTML div元素)放入分面搜索代码的var item_template部分,如下所示,但这不会显示滑块。例如,这只是滑块javascript已放置在分面搜索代码中:

 var item_template =  
                   'var trendingslider1 = $(\'#trendingslider1\'); ' +
                           'trendingslider1.noUiSlider({' +
    'start: [ tslider1v3 ],' +

   'range: {' +
    '\'min\': [  tslider1v1 ],' +
    '\'max\': [ tslider1v3 ]' +
    '},' +
        'serialization: {' +
    'lower: [' +

        '$.Link({' +
            'target: $("#pledgepriceviewtrend1")' +      
        '}),' +

                   ' $.Link({' +
            'target: $("#pledgepricesubmittrend1")      ' +
        '})' +

        '],' +

           ' format: {' +

        'decimals: 2,' +

    '}' +
    '}' +

'});' +





'function getGroupTrendingSlider1(){   ' +   

'valuestr = $("#trendingslider1").val();  ' + 
'valuenum = Number(valuestr);' +

  'if (window.XMLHttpRequest) {' +

'xmlhttp=new XMLHttpRequest();' +
  '} else { // code for IE6, IE5' +
  '  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");' +
  '}' +
  'xmlhttp.onreadystatechange=function() {' +
    'if (xmlhttp.readyState==4 && xmlhttp.status==200) {' +
  'document.getElementById("pplleftingroup").innerHTML=xmlhttp.responseText;' +
   '}' +
  '}' +
'xmlhttp.open("GET","posttrending1v3.php?q=",true);'
     ;

我是以错误的方式解决这个问题吗?是否与尝试同时使用nouislider.js和facetedsearch.js文件有关?任何帮助非常感谢! 克里斯

0 个答案:

没有答案