Dhruvang Gajjar
Dhruvang Gajjar

Reputation: 598

Remove Specific Data from Cookie using jQuery or Javascript

I'm manipulating cookie data for Scheduling Calendar. I've array in cookie, using it i have made table. Now i want to delete table rows from last delete button of last column of the row.

My Code as given below

$cookie_data = '2017-06-27+06:00-06:30,2017-06-29+12:00-12:30,2017-07-01+06:00-12:00-17:00 ';

echo '<table class="table table-bordered"  id="schedule">
<tr>
<th>Date</th>
<th>Times</th>
<th>Delete</th>
</tr>';
$val = $cookie_data;
$num_dates = explode(',',$val);
foreach($num_dates as $k => $v){
    $bdata = explode('+',$v);
    echo '<tr><td><label>'.$bdata[0].'</label></td><td><label>'.$bdata[1].'</label></td><td><button>Delete</button></td></tr>';
}
echo '</table>';

Also Code is running on phpfiddle.

http://phpfiddle.org/main/code/8ch0-merp

Now i want to remove any value by clicking delete button.

Upvotes: 1

Views: 276

Answers (2)

Nirav Joshi
Nirav Joshi

Reputation: 2950

try with this,

Currently it will give error in fiddle. because stackoverflow not allowing to set custom cookie. So you can try this code at your side, and also i convert code in html so you have to convert in php.

You can set your cookie name as you want i just give example here.

Hope this will helps you :)

$("button").on("click",function() {
    var cookieStr = $(this).attr("data-cookie");
    var setCookieVal = [];
    var cookieValue = $("#cookievalue").val().split(",");
    for(i = 0; i< cookieValue.length; i++) {
        if(cookieStr !== cookieValue[i]) {
           setCookieVal.push(cookieValue[i]);
        }
    }
    $.cookie("yourCookie",setCookieVal);
    $(this).parent().parent().remove();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<body>
  <input type="hidden" value="2017-06-27+06:00-06:30,2017-06-29+12:00-12:30,2017-07-01+06:00-12:00-17:00" id="cookievalue">
  <table class="table table-bordered" id="schedule">
	  <tbody>
      <tr>
        <th>Date</th>
        <th>Times</th>
        <th>Delete</th>
      </tr>
      <tr>
        <td><label>2017-06-27</label></td>
        <td><label>06:00-06:30</label></td>
        <td>
          <button data-cookie="2017-06-27+06:00-06:30">Delete</button>
         </td>
      </tr>
      <tr>
        <td><label>2017-06-29</label></td>
        <td><label>12:00-12:30</label></td>
        <td>
          <button data-cookie="2017-06-29+12:00-12:30">Delete</button>           
        </td>
      </tr>
      <tr>
        <td><label>2017-07-01</label></td>
        <td><label>06:00-12:00-17:00 </label></td>
        <td>
          <button data-cookie="2017-07-01+06:00-12:00-17:00">Delete</button>           
        </td>
      </tr>
    </tbody>
  </table>
</body>

Upvotes: 1

harsh kumar
harsh kumar

Reputation: 165

  If do you want to delete cookie use $.dough in Jquery Plugin and for this  you should specify name of the cookie like this example :

Create Cookie

//Code Starts
$.dough("cookieName", "cookieValue");
//Code Ends

Read Cookie

//Code Starts
$.dough("cookieName");
//Code Ends

Delete Cookie

//Code Starts
$.dough("cookieName", "remove");
//Code Ends

Upvotes: 0

Related Questions