JQuery Extras

JQuery Extras

Just a collection of useful snippets when using Bootstrap and JQuery.

Getting an ID from a clicked item

I use classes and id's to detect items clicked say for example an icon that will show a details dialogue. The icon will have a class of 'iconEdit' and an id of 'iconEdit_{(01474AFC-E439-955B-A018-DAF210E67CF3)}.

The older way was as follows:

$("#ActionClicked").click(function () {
  var test = $(this).attr("id");
  var positionStart = test.indexOf("_");
  var movieId = test.substr(positionStart + 1);
  //.....
});

By adding the following function, we can reduce the code:

function GetValueFromId($Item){
  var positionStart = $Item.indexOf('_');
  return $Item.substr(positionStart + 1);
}

So now we just need:

$('#ActionClicked').on('click', '.ThumbLink', function (event) {
  // direct call
  var id = GetValueFromId($(this).attr('id'));
  // or in say an ajax call
  $.ajax({
    type: 'GET',
    async: false,
    url: 'ajaxurl',
    data: {
      Action : 'AjaxAction',
      Id     : GetValueFromId($(this).attr('id'))
    }
  });
});

This page was last modified on Friday, 18th July 2014 at 10:27:56 by Gary Keeling. © 2019 GKWeb Design.

Categorised as: Development

GK5 Footer

and whatever