Pobieranie danych z miejsca do którego przeniesiono element

0

Więc tak mam sobie taką sytuację.


pole 1 | element 1


pole 2 | element 2

Przy czym elementy można swobodnie przemieszczać, zamieniać z drag nad drop.

Problem zaczyna się gdy chcę zapisać zmiany, Bowiem to gdzie się znajdują elemenety przechowuję w takiej postaci

<input type="hidden" class="ligt" name="'.$nazwa_miejsca[$i].'[]" value="'.$modul[$d].'" style="width:50px;"/>

zmienna $nazwa_miejsca jest wypełniana przy okazji pętli. Tak iż element z przykładu miałby tam nazwę 'pole1', a element2 nazwę 'pole2', tak więc gdy nawet element1 przeniosę do pola drugiego to i tak przy zapisie tego stanu interpreter sobie "pomysli" ze on jest w polu1. Jak wiec zrobić by po przeniesieniu nazwa miejsca była zgodna z jej faktycznym stanem?

Wykorzystuje taką bibliotekę drag and drop:

(function($) {
var dragging, placeholders = $();
$.fn.sortable = function(options) {
	var method = String(options);
	options = $.extend({
		connectWith: false
	}, options);
	return this.each(function() {
		if (/^enable|disable|destroy$/.test(method)) {
			var items = $(this).children($(this).data('items')).attr('draggable', method == 'enable');
			if (method == 'destroy') {
				items.add(this).removeData('connectWith items')
					.off('dragstart.h5s dragend.h5s selectstart.h5s dragover.h5s dragenter.h5s drop.h5s');
			}
			return;
		}
		var isHandle, index, items = $(this).children(options.items);
		var placeholder = $('<' + (/^ul|ol$/i.test(this.tagName) ? 'li' : 'div') + ' class="sortable-placeholder">');
		items.find(options.handle).mousedown(function() {
			isHandle = true;
		}).mouseup(function() {
			isHandle = false;
		});
		$(this).data('items', options.items)
		placeholders = placeholders.add(placeholder);
		if (options.connectWith) {
			$(options.connectWith).add(this).data('connectWith', options.connectWith);
		}
		items.attr('draggable', 'true').on('dragstart.h5s', function(e) {
			if (options.handle && !isHandle) {
				return false;
			}
			isHandle = false;
			var dt = e.originalEvent.dataTransfer;
			dt.effectAllowed = 'move';
			dt.setData('Text', 'dummy');
			index = (dragging = $(this)).addClass('sortable-dragging').index();
		}).on('dragend.h5s', function() {
			dragging.removeClass('sortable-dragging').show();
			placeholders.detach();
			if (index != dragging.index()) {
				items.parent().trigger('sortupdate', {item: dragging});
			}
			dragging = null;
		}).not('a[href], img').on('selectstart.h5s', function() {
			this.dragDrop && this.dragDrop();
			return false;
		}).end().add([this, placeholder]).on('dragover.h5s dragenter.h5s drop.h5s', function(e) {
			if (!items.is(dragging) && options.connectWith !== $(dragging).parent().data('connectWith')) {
				return true;
			}
			if (e.type == 'drop') {
				e.stopPropagation();
				placeholders.filter(':visible').after(dragging);
				return false;
			}
			e.preventDefault();
			e.originalEvent.dataTransfer.dropEffect = 'move';
			if (items.is(this)) {
				if (options.forcePlaceholderSize) {
					placeholder.height(dragging.outerHeight());
				}
				dragging.hide();
				$(this)[placeholder.index() < $(this).index() ? 'after' : 'before'](placeholder);
				placeholders.not(placeholder).detach();
			} else if (!placeholders.is(this) && !$(this).children(options.items).length) {
				placeholders.detach();
				$(this).append(placeholder);
			}
			return false;
		});
	});
};
})(jQuery);

0

To chociaż proszę o podpowiedz jak pobrać z tego pola informację o jego nazwie i zapisać ją do zmiennej. Mogę ja zapisać dowolnie w < td >.

Ja zrobiłem tak i jest jakiś bug ... :

$(document).ready(function(){
    $(".column").mouseover(function(){
	 var nazwapola = $(this).parent().parent().parent().data('name');
	 
    });
    $(".column").mouseout(function(){

        $(this).find('.ligt').attr('name', ""+nazwapola+"" );
    });
});

Znaczy się, na pewno odnoszę się do odpowiedniego elementu (sprawdzone) czyli do

<td data-name="slidebar" class="lg2">

I na pewno dobrze zamienia atrybuty bo jeżeli tam wstawię jakąkolwiek inna wartość do dobrze ją zamienia. a to budowa tego elementu.


<td data-name="slidebar" class="lg2">
<ul class="connected1 list">

<div class="dol" draggable="true" style="display: block;">
                      <li class="column" draggable="true" data-name="column">

				<input type="hidden" name="kateg[]" value="user" style="width:50px;">  	
				<input type="hidden" class="ligt" name="default" value="user" style="width:50px;">
					user
			</li>
					<img style="visibility: hidden;" src="../img/elements/kros.png" width="20" class="cros">
</div></ul></td>
0

Już sobie poradziłem rozwiązanie było łatwiejsze niż sądziłem:

a błąd w szukaniu zmiennej w nieodpowiednim miejscu:

$(document).ready(function(){
    $(".column").mouseover(function(){
	 
    });
    $(".column").mouseout(function(){
       	var nazwapola = $(this).parent().parent().parent().data('name');
        $(this).find('.ligt').attr('name', ""+nazwapola+"[]" );
    });
});

1 użytkowników online, w tym zalogowanych: 0, gości: 1