jQuery Forum

tooltip on slider
[0Replies]
- 05-Jun-2013 12:33 PM
- Forum: Using jQuery Plugins
1.                 $("#sw").slider({
                      orientation    : "horizontal",
                      range        : "min",
                      min            : 0,
                      max            : 2000,
                      value        : $("#i1").width(),
                      start        : function(event,ui) {
                                      $("#tooltip").css("display","block");
                      },
                      slide        : function (event, ui) {
                                      $("#i1").css({"width": $("#sw").slider("value")});
  
                                      $('#tooltip').css({
                                             left: e.pageX + 20,
                                             top:   e.pageY + 20
                                      });
                                      $("#tooltip").text(ui.value);
  
                      },
  
                      stop        : function(event,ui) {
                                         $("#tooltip").css("display","none");
                      }
  
                  });
1. <div id="tooltip">mouse tooltip</div>
2.        <style>
              #tooltip {
                  position: absolute;
                  float: left;
                  display:none;
              }
          </style>
div element does not follow mouse (handle) why ?

and when i move other slider div element is showing just "mouse tooltip" not value

dblclick problem and html char
[9Replies]
- 05-Jun-2013 09:40 AM
- Forum: Getting Started
1. $(document).ready(function() {
          $(".ie").dblclick(function(){
              var defie = $(".ie").html();
              $(".ie").html('<input type="text" value="'+defie+'">');
      });
  });
2. <div class="ie">jquery click</div>

slider and css problem
[3Replies]
- 12-May-2013 03:15 PM
- Forum: Using jQuery UI
i can not change image properties
1.         <script>
              $(function () {
                  $("#sw").slider({
                      orientation    : "horizontal",
                      range        : "min",
                      min            : 0,
                      max            : 2000,
                      value        : $("#i1").width(),
                      slide        : function (event, ui) {
                      }
                  });
  
                  $("#sh").slider({
                      orientation    :"horizontal",
                      range        : "min",
                      min            : 0,
                      max            : 2000,
                      value        : $("#i1").height(),
                      slide        : function (event, ui) {
                      }
                  });
  
                  $("#br").slider({
                      orientation    :"horizontal",
                      range        : "min",
                      min            : 0,
                      max            : 1000,
                      value        : 0,
                      slide        : function (event, ui) {
                      }
                  });
  
  
                  $("#i1").css({
                      "height"    : $("#sh").slider("value"),
                      "width"     : $("#sw").slider("value"),
                      "border"     : $("#br").slider("value")
  
                      })
              });
          </script>
      </head>
  
  <body>
  <p>
  
  
  
         <input type="text" id="am" style="border: 0; color: #f6931f; font-weight: bold;" /> <br/>
  
          W : <div id="sw" style="height: 10px; width:200px;"></div><br/>
          H : <div id="sh" style="height: 10px; width:200px;"></div><br/>
          B : <div id="br" style="height: 10px; width:200px;"></div>
      
      <br/><br/>
          <img id="i1" src="images/r1.jpg" width="900" height="400" border="10">

fetch data as html
[1Reply]
- 27-Apr-2013 06:16 AM
- Forum: Using jQuery
php file
1. $i=0;
  while ($row = mysql_fetch_array($result)) {
  $i++;
  echo '<option value="'.$row["ContactName"].'">'.$row["ContactName"].'</option>';
  
  }
js file
1. $.get("cbox2.php",function(veri){
2. var data = veri.split(" ");
3. $.each(data,function(index,value){
4. $("#sb1").append(index,value);
5. })
6. <select id="sb1"></select>
  <button id="b1">Get</button>
i can not get data as html like <option value="zode">zode</option> from php file. when i use html() i can get ust first value. when i use append() just value not html tag

image create problem in verification (ajax)
[5Replies]
- 21-Apr-2013 05:20 AM
- Forum: Using jQuery
i am trying to create image from random number . i can move random number to resim.php.
1.                             $.ajax({
                                  type        :"POST",
                                  url            :"font/resim.php",
                                  dataType    :"html",
                                  data        :{num: numRand},
                                  success        : function (data){
                                                  $("#son").html("<img src="+ data +" />");
                                              },
                                  error        : function (data, textStatus){
                                                  $("#son").html(data);
                                  }
                              });
when i callback alue as image it is problem like following

resim.php
1. ######################## PHP hata raporlalama #############################
  error_reporting(E_ERROR | E_WARNING | E_PARSE | E_NOTICE);
  
  //Outurum baþlýyor
  session_start();
  
  //rastgele içeriði oturuma (SESSION) yaz
  $_SESSION["rip"] = $_POST["num"];
  
  ################### Resmi çiz ##########################################
  header("Content-type: image/png");
      $image        = imagecreatetruecolor(75, 18) or die("GD Library hatasi"); //resim boyutu
      $fcolor     = imagecolorallocate($image, 255, 255, 255);    //Yazý rengi
      $bcolor     = imagecolorallocate($image, 99, 99, 99); //arkaplan rengi
  imagefilledrectangle($image, 0, 0, 300, 100, $bcolor); //resmin arkaplaný
  imagettftext($image, 12, 0, 10, 14, $fcolor, "arial.ttf",$_SESSION["rip"]);
  imagepng($image);
  imagedestroy($image);

data single line coming from ajax
[3Replies]
- 17-Apr-2013 03:52 PM
- Forum: Using jQuery
why data loaded into combobox from php file is single line ?
1. $(document).ready(function() {
          $("#send").bind("click", function(){
              $.get("cbox6.php",function(data){
                      $("#cb").append('<option value="'+data+'">'+data+'</option>');
              })
          })
  
  });
2. <select ID="cb">
  <option Value="0"> Please Select</option >
  </select>
  
  <input type="text" id="txt"/>
  <button id="b1">OK</button>
  <button id="send">send</button>
  <div id="tablo"></div>
php file
1. while ($row = mysql_fetch_array($result)) {
  
          echo $row["ContactName"];
  
  }

regex id for button
[5Replies]
- 14-Apr-2013 08:39 AM
- Forum: Using jQuery
how can i assign code to id starting with "d_" for exampe when i clicked button which id start with d_ some function will run
1. $(document).ready(function(){
2. $( //id starting with d_).bind("click",function(){
3. //ANY CODES
5. })
6. })
1.          $i=0;
          while ($row = mysql_fetch_array($result)) {
              $i++;
              if ($row["OrderID"] != '') {
                    echo '
                      <tr class="tr'.$i.'">
                          <td><div>' . $i                 . '</div></td>
                          <td><div>' . $row["CustomerID"] . '</div></td>
                          <td>
                              <div>
                                  <button id="b_'.$i.'" >OK </button>
                                  <button id="d_'.$i.'" >del </button>
  
                              </div>
                          </td>
                      </tr>

i cant getting element value (for inlineedit)
[1Reply]
- 16-Feb-2013 09:48 AM
- Forum: Using jQuery
inded.php
1. while ($row = mysql_fetch_array($result)) {
      echo'
          <tr>
              <td class="inlineEdit"><div>'.$row["id"].'</div></td>
              <td class="inlineEdit"><div id="c1_'.$row["id"].'">'.$row["first_name"]    .'</div></td>
              <td class="inlineEdit"><div id="c2_'.$row["id"].'">'.$row["last_name"]    .'</div></td>
              <td class="inlineEdit"><div id="c3_'.$row["id"].'">'.$row["email"]        .'</div></td>
              <td class="inlineEdit"><div id="c4_'.$row["id"].'">'.$row["hire_date"]    .'</div></td>
          </tr>
          ';
  }
f.js
1.         NewText = $(this).siblings("form").children(".edit").val();
          var id = $(this).parent().attr("id");
          var data = 'id=' + id + '&text=' + NewText;
  
          $.post("update.php", data, function (response) {
              $("#response").html(response);
              $("#response").slideDown('slow');
              slideout();
              $("#loading").fadeOut('slow');
  
          });
  
          $(this).parent().html(NewText).removeClass("selected").bind("click", updateText);
  
      });
  
      $(".revert").live("click", function () {
          $(this).parent().html(OrigText).removeClass("selected").bind("click", updateText);
      });
  
      function updateText() {
  
          $('li').removeClass("inlineEdit");
          OrigText = $(this).html();
          $(this).addClass("selected").html('<form><textarea class="edit">' + OrigText + '</textarea> </form><a href="#" class="save"><img src="images/save.png"/></a> <a href="#" class="revert"><img src="images/cancel.png"/></a>').unbind('click', updateText);
  
      }
  });
when i push ok button it is null (like you see in pic .)

show datepicker in inlineedit
[7Replies]
- 06-Feb-2013 01:08 PM
- Forum: Using jQuery UI
i am trying to show datepicker in inlineedit bu i can not codes are following
1. <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
  <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <script>
  $(function() {
  $( "#datepicker" ).datepicker();
  });
  </script>
  <?php
  include('db.php');
  echo '<link rel="stylesheet" type="text/css" href="style.css">';
  echo'<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>';
  
  echo'<table class="tablo1">
          <tr>
  
              <td class="td2">No</td>
              <td class="td2">Adi</td>
              <td class="td2">Soyadi</td>
              <td class="td2">D</td>
          </tr>
          ';
  $i=0;
  $sql=mysql_query("select * from fullnames");
  while($row=mysql_fetch_array($sql)){
      $i++;
      $id            =$row['id'];
      $firstname    =$row['firstname'];
      $lastname    =$row['lastname'];
  echo'
      <tr id="'.$id.'" class="edit_tr">
          <td class="td1">'.$i.'</td>
          <td class="td1">
              <span id="first_'.$id.'" class="text">'. $firstname.'</span>
              <input type="text" value="'.$firstname.'" class="datepicker" id="first_input_'.$id.'">
          </td>
          <td class="td1">
              <span id="last_'.$id.'" class="text">'.$lastname.'</span>
              <input type="text" value="'.$lastname.'" class="datepicker" id="last_input_'.$id.'"/>
          </td>
          <td class="td1">
              <a href="#"><img id="iedit" src="edit.png" /></a>
              <a href="#"><img src="del.png" /></a>
          </td>
      </tr>
  ';
  }
  echo'
      </table>
  ';
  ?>
  
  <script type="text/javascript">
  $(document).ready(function(){
      $(".edit_tr").click(function(){
          var ID=$(this).attr('id');
          $("#first_"+ID).hide();
          $("#last_"+ID).hide();
          $("#first_input_"+ID).show();
          $("#last_input_"+ID).show();
          }
      ).change(function(){
          var ID=$(this).attr('id');
          var first=$("#first_input_"+ID).val();
          var last=$("#last_input_"+ID).val();
          var dataString = 'id='+ ID +'&firstname='+first+'&lastname='+last;
          $("#first_"+ID).html('<img src="load.gif" />'); // Loading image
  
  if(first.length>0&& last.length>0){
      $.ajax({
      type    : "POST",
      url        : "table_edit_ajax.php",
      data    : dataString,
      cache    : false,
      success    : function(html)
      {
          $("#first_"+ID).html(first);
          $("#last_"+ID).html(last);
      }
  });
  }else{
      alert('Enter something.');
  }
  });
  
  // Edit input box click action
  $(".editbox").mouseup(function(){
      return false
  });
  
  // Outside click action
  $(document).mouseup(function(){
      $(".editbox").hide();
      $(".text").show();
  });
  
  });
  </script>

increase datpicker cell
[1Reply]
- 26-Mar-2012 01:01 PM
- Forum: Using jQuery Plugins
how can i increase or decrease datepicker cell (row) size ?

json inline edit does not run
[3Replies]
- 10-Mar-2012 04:17 PM
- Forum: Using jQuery Plugins
when it is not json it run correctly but is is json does not run for inline edit
1. <script type="text/javascript">
      $(document).ready(function(){
          var url="json.php";
          $("#tablo1 tbody").html("");
          $.getJSON(url,function(data){
              $.each(data.members, function(i,user){
              var tblRow =
                  '<tr>'
                      +'<td class="inlineEdit">'+user.id+'</td>'
                      +'<td class="inlineEdit">'+user.firstname+'</td>'
                      +'<td class="inlineEdit">'+user.lastname+'</td>'
                      +'<td class="inlineEdit">'+user.adres+'</td>'
                      +'<td class="inlineEdit">'+user.city+'</td>'
                      +'<td class="inlineEdit">'+user.state+'</td>'
                      +'<td class="inlineEdit">'+user.zip+'</td>'
                      +'<td class="inlineEdit">'+user.phone+'</td>'
                      +'<td class="inlineEdit">'+user.email+'</td>'
                      +'<td class="inlineEdit">'+user.source+'</td>'
                  +'</tr>' ;
              $(tblRow).appendTo("#tablo1 tbody");
              });
          });
      });
  </script>

table sorter problem
[0Replies]
- 10-Mar-2012 05:50 AM
- Forum: Using jQuery
when i first open my page and click button to open pop up there is no problem like following

http://divran.com/s/upload/images/3509dkl74cqy8yle7bkm.gif

but when i sort any cloumn and than click button to open opop up following problem occurs

http://divran.com/s/upload/images/w584vccfmaxnocex5tg.gif

i am using following command
1. $(document).ready(function() {
      zebraRows('tr:odd td', 'odd');
  
      $('tbody tr').hover(function(){
      $(this).find('td').addClass('hovered');
      }, function(){
      $(this).find('td').removeClass('hovered');
      });
  
      //default each row to visible
      $('tbody tr').addClass('visible');
  
      //overrides CSS display:none property
      //so only users w/ JS will see the
      //filter box
      $('#search').show();
  
      $('#filter').keyup(function(event) {
          //if esc is pressed or nothing is entered
      if (event.keyCode == 27 || $(this).val() == '') {
              //if esc is pressed we want to clear the value of search box
              $(this).val('');
  
              //we want each row to be visible because if nothing
              //is entered then all rows are matched.
        $('tbody tr').removeClass('visible').show().addClass('visible');
      }
  
          //if there is text, lets filter
          else {
        filter('tbody tr', $(this).val());
      }
  
          //reapply zebra rows
          $('.visible td').removeClass('odd');
          zebraRows('.visible:even td', 'odd');
      });
  
      //grab all header rows
      $('thead th').each(function(column) {
          $(this).addClass('sortable')
                      .click(function(){
                          var findSortKey = function($cell) {
                              return $cell.find('.sort-key').text().toUpperCase() + ' ' + $cell.text().toUpperCase();
                          };
  
                          var sortDirection = $(this).is('.sorted-asc') ? -1 : 1;
  
                          //step back up the tree and get the rows with data
                          //for sorting
                          var $rows        = $(this).parent()
                                                                  .parent()
                                                                  .parent()
                                                                  .find('tbody tr')
                                                                  .get();
  
                          //loop through all the rows and find
                          $.each($rows, function(index, row) {
                              row.sortKey = findSortKey($(row).children('td').eq(column));
                          });
  
                          //compare and sort the rows alphabetically
                          $rows.sort(function(a, b) {
                              if (a.sortKey < b.sortKey) return -sortDirection;
                              if (a.sortKey > b.sortKey) return sortDirection;
                              return 0;
                          });
  
                          //add the rows in the correct order to the bottom of the table
                          $.each($rows, function(index, row) {
                              $('tbody').append(row);
                              row.sortKey = null;
                          });
  
                          //identify the column sort order
                          $('th').removeClass('sorted-asc sorted-desc');
                          var $sortHead = $('th').filter(':nth-child(' + (column + 1) + ')');
                          sortDirection == 1 ? $sortHead.addClass('sorted-asc') : $sortHead.addClass('sorted-desc');
  
                          //identify the column to be sorted by
                          $('td').removeClass('sorted')
                                      .filter(':nth-child(' + (column + 1) + ')')
                                      .addClass('sorted');
  
                          $('.visible td').removeClass('odd');
                          zebraRows('.visible:even td', 'odd');
                      });
      });
  });
  
  //used to apply alternating row styles
  function zebraRows(selector, className)
  {
      $(selector).removeClass(className)
                              .addClass(className);
  }
  
  //filter results based on query
  function filter(selector, query) {
      query    =    $.trim(query); //trim white space
  query = query.replace(/ /gi, '|'); //add OR for regex
  
  $(selector).each(function() {
      ($(this).text().search(new RegExp(query, "i")) < 0) ? $(this).hide().removeClass('visible') : $(this).show().addClass('visible');
  });
  }

php error handling problem
[1Reply]
- 09-Mar-2012 04:50 AM
- Forum: Using jQuery
this is index.php
1.          $.ajax({
              type: "POST",
              url: "save.php",
              data: "fname="+fname+"&lname="+lname+"&addr="+addr+"&city="+city+"&state="+state+"&zip="+zip+"&tel="+tel+"&email="+email+"&ip="+ip+"&source="+source+"&date="+date,
                 success: function(html){
                if(html=='true')
                {
                  $("#form1").fadeOut("normal");
                  $("#shadow").fadeOut();
                  $("#profile").html("<a href='logout.php' id='logout'>Logout</a>");
                }else{
                      $("#add_err").html("<?php echo "Hata No : ".mysql_errno()."<br/> Hata Mesajý :".mysql_error();?>");
                }
              },
              beforeSend:function(){
                   $("#add_err").html("Loading...")
              }
          });
this iis save.php file
1. <?php
  include("dbcon.php");
  
  $fname    = $_POST['fname'];
  $lname    = $_POST['lname'];
  $adres    = $_POST['addr'];
  $city    = $_POST['city'];
  $state    = $_POST['state'];
  $zip    = $_POST['zip'];
  $tel    = $_POST['tel'];
  $email    = $_POST['email'];
  $ip        = $_POST['ip'];
  $source    = $_POST['source'];
  $date    = $_POST['date'];
  
  $sql = "INSERT INTO contac VALUES ('','$fname','$lname','$adres','$city','$state','$zip','$tel','$email','$ip','$source','$date')";
  
  if(!mysql_query($sql))
  {
      echo "Hata No : ".mysql_errno()."<br/> Hata Mesajý :".mysql_error();
  }
i can not get mysql error to <div id="result"></div> in index.php file

css for datepicker button
[1Reply]
- 08-Mar-2012 10:49 PM
- Forum: Using jQuery
1. buttonImage: 'images/cal.gif',
how can i define a css for this button

fetching mysql error
[1Reply]
- 06-Mar-2012 04:25 AM
- Forum: Using jQuery
1. <script type="text/javascript" src="jquery.js"></script>
  <link rel="stylesheet" href="styles.css" type="text/css" />
  <title>Popup Login</title>
  <script type="text/javascript">
  $(document).ready(function(){
      $("#login_a").click(function(){
          $("#shadow").fadeIn("normal");
           $("#login_form").fadeIn("normal");
           $("#user_name").focus();
      });
      $("#cancel_hide").click(function(){
          $("#login_form").fadeOut("normal");
          $("#shadow").fadeOut();
     });
     $("#login").click(function(){
  
          username=$("#user_name").val();
          password=$("#password").val();
           $.ajax({
              type: "POST",
              url: "x.php",
              data: "name="+username+"&pwd="+password,
              success: function(html){
                if(html=='true')
                {
                  $("#login_form").fadeOut("normal");
                  $("#shadow").fadeOut();
                  $("#profile").html("<a href='logout.php' id='logout'>Logout</a>");
  
                }
                else
                {
                      $("#add_err").html("Wrong username or password");
                }
              },
              beforeSend:function()
              {
                   $("#add_err").html("Loading...")
              }
          });
           return false;
      });
  });
  </script>
  </head>
  <body>
  <?php session_start(); ?>
      <div id="profile">
          <?php if(isset($_SESSION['user_name'])){
              ?>
              <a href='logout.php' id='logout'>Logout</a>
          <?php }else {?>
          <a id="login_a" href="#">login</a>
          <?php } ?>
      </div>
      <div id="login_form">
          <div class="err" id="add_err"></div>
          <form action="x.php">
              <label>User Name:</label>
              <input type="text" id="user_name" name="user_name" />
              <label>Password:</label>
              <input type="password" id="password" name="password" />
              <label></label><br/>
              <input type="submit" id="login" value="Login" />
              <input type="button" id="cancel_hide" value="Cancel" />
          </form>
      </div>
      <div id="shadow" class="popup"></div>
  </body>
  </html>
after i send value to x.php if any error occurs how can i fetch / print mysql error into screen or anywhere ?

inline edit in blank <td>
[7Replies]
- 04-Mar-2012 05:39 AM
- Forum: Using jQuery
this is my table coming from db
1. while ($row = mysql_fetch_array($result)) {
     echo'
         <tr class="record">
             <td class="td1"><div>'.$row["id"].'</div></td>
             <td class="td1"><div class="inlineEdit" id="c1_'   .$row["id"].'">'.$row["firstname"]   .'</div></td>
             <td class="td1"><div class="inlineEdit" id="c2_'   .$row["id"].'">'.$row["lastname"]   .'</div></td>
             <td class="td1"><a href="#" id="'.$row["id"].'" class="delbutton"><div><img src="images/delete.png" /></div></a></td>
  
         </tr>
     ';
  }
  ?>
to inline edit i ma using following . if any row is blank inlinedeit doesnot run. why ?
1. $(".inlineEdit").bind("click", updateText);
  
      var OrigText, NewText;
  
      $(".save").live("click", function () {
  
          $("#loading").fadeIn('slow');
  
          NewText = $(this).siblings("form").children(".edit").val();
          var id = $(this).parent().attr("id");
          var data = 'id=' + id + '&text=' + NewText;
  
          $.post("update.php", data, function (response) {
              $("#response").html(response);
              $("#response").slideDown('slow');
              slideout();
              $("#loading").fadeOut('slow');
  
          });
  
          $(this).parent().html(NewText).removeClass("selected").bind("click", updateText);
  
      });
  
      $(".revert").live("click", function () {
          $(this).parent().html(OrigText).removeClass("selected").bind("click", updateText);
      });
  
      function updateText() {
  
          $('li').removeClass("inlineEdit");
          OrigText = $(this).html();
          $(this).addClass("selected").html('<form >
                                                 <textarea class="edit">'+OrigText+'</textarea>
                                             </form>
                                            <a href="#" class="save">
                                            <img src="images/save.png" border="0" width="48" height="15"/>
                                            </a>
                                            <a href="#" class="revert">
                                             <img src="images/cancel.png" border="0" width="58" height="15"/>
                                            </a>').unbind('click', updateText);
  
      }
  });

record sortable order into mysql
[1Reply]
- 15-Jan-2012 01:03 PM
- Forum: Using jQuery UI
how can i record "sortable" order into mysql

JS install problem in "coda-slider.1.1.1" second tab
[0Replies]
- 30-Mar-2010 06:38 PM
- Forum: Using jQuery
i am using chained combox in a form. in coda-slider. but (not first) in other tab chained combobox is not run (mycodes is in attachment)
Attachments
- Download
  Delete
  coda-slider.1.1.1.rar
  Size: 40.26 KB Downloads: 1649

Response title

Attachments

jQuery Forum

Activity Trend