html - jQuery ID+ Class selecter -
currently script below shows console.log(inputname)
first variable in code no matter button clicked. how can alter script can input name foreach row have use id + class selector?
jquery:
$(function(){ $.fn.editable.defaults.mode = 'inline'; $.fn.editable.defaults.params = function (params) { params._token = $("#_token").data("token"); return params; }; var dataurl = $('.updatefield').data('url'); var inputname = $('.updatefield').attr("name"); $('.updatefield').editable({ type: 'text', url: dataurl, name: inputname, placement: 'top', title: 'enter public name', toggle:'manual', send:'always', ajaxoptions:{ datatype: 'json' } }); $('.edit').click(function(e){ console.log(inputname); e.stoppropagation(); $('.updatefield').editable('toggle'); $('.edit').hide(); }); $(document).on('click', '.editable-cancel, .editable-submit', function(){ $('.edit').show(); })
html example:
<div class="form-group"> <label class="col-sm-2 control-label" for="sitename">website name</label> <div class="col-sm-3"> <div class="input-group"> <input class="form-control updatefield" data-url="{{ route('generaldatasubmit', 1)}}" data-title="website name" name="sitename" placeholder="email" type="input" value="{{ old('sitename', $sitesettingsdata->sitename)}}"> <span class="input-group-btn"><button class="btn btn-default edit" type="button"><span class="glyphicon glyphicon glyphicon-pencil"></span></button></span> </div> </div> </div>
since have multiple .updatefield
elements, need find target 1 within click function using closest()
, find()
functions.
$('.edit').click(function(e) { var container = $(this.closest('.input-group')); var input = container.find('.updatefield'); var inputname = input.attr('name'); var dataurl = input.data('url'); console.log(inputname); e.stoppropagation(); input.editable('toggle'); container.find('.edit').hide(); }); $(document).on('click', '.editable-cancel, .editable-submit', function() { $('.edit').show(); });
Comments
Post a Comment