Jump to content

pustofkj

Members
  • Content Count

    4
  • Joined

  • Last visited

Community Reputation

0 Neutral

About pustofkj

  • Rank
    Newbie
  1. Hello, it looks sensibly, I tried it different ways, but it's still not working, could you give me an simple example please? Thank you very much.
  2. Yeah, I tried both: current.ondragover = null; current.removeAttribute('ondragover')); and even with jQuery $('#' + current.getAttribute('id')).attr('ondragover', '').unbind('dragover'); but anything doesn't work :-(, the field is still droppable. I even tried create new element with necessary data (id, class, innerHTML) and replaceChild, and I don't know why but it doesn't work neither.Here is my current code: function drop(ev) { ev.preventDefault(); ev.target.appendChild(document.getElementById(ev.dataTransfer.getData('Text'))); // find every droppable field var replace = new Array(); var xpathResult = document.evaluate('//div[@class="field"]', document, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null); var replaceIter = 0; var current = xpathResult.iterateNext(); while (current) { if (current.ondragover) { replace[replaceIter] = current; replaceIter++; } current = xpathResult.iterateNext(); } // replace fields with new ones for (var i = 0; i < replaceIter; i++) { current = document.getElementById(replace[i].getAttribute('id')); var newField = document.createElement('div'); newField.setAttribute('id', current.getAttribute('id')); newField.setAttribute('class', current.getAttribute('class')); newField.ondrop = function(ev) { drop(ev); } // newField.innerHTML = replace[i].innerHTML; newField.innerHTML = 'A'; current.parentNode.replaceChild(current, replace[i]); }} When this code didn't work, I tried to appendChild and it works, so my last idea is, that I could remove current field and new field insert after one before current. But I'm afraid that this change will be visible for human eye.
  3. Thanks for your response :-).No, I think not. When I set: current.ondragover = function(ev) { return false; } everything is droppable now. The default browser behaviour is sending events and when you want to prevent this behaviour, you have to call preventDefault() on event. And when you want to restore the default, usually returning true is good enough. But not in this case and I don't know why. So, I can make div droppable, but never switch it off :-(Another idea?
  4. Hi all, I don't know if this topic should be part of JavaScript or HTML forum, but I think here it is ok - I'm sorry if it's not. I'm developing a school work - chess game for two players. It has to be RIA and we should use HTML5 platform or Silverlight. I decided for HTML5 and I'd like to use HTML5 drag&drop.Well, when somebody clicks e.g. on white pawn on B2, the application should now make field B3 droppable and after drop the dropability should be prevented.So I'm learning HTML5 drag&drop. This is my code: function allowDrop(ev) { ev.preventDefault(); } function drag(ev) { if (ev.target.id == 'B2_piece') { var targetField = document.getElementById('B3_field'); /**** here I'm making field B3 droppable - it's working ****/ targetField.ondragover = function(ev) { allowDrop(ev); }; targetField.className = targetField.className + ' allowed'; } ev.dataTransfer.setData('Text', ev.target.id);} function drop(ev) { ev.preventDefault(); ev.target.appendChild(document.getElementById(ev.dataTransfer.getData('Text'))); ev.target.className = ev.target.className.replace(' allowed', ''); /**** here I'd like to prevent dropability on every field - in this case only field B3 ****/ var xpathResult = document.evaluate('//div[@ondragover]', document, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null); var current = xpathResult.iterateNext(); while (current) { current.ondragover = function(ev) { return true; } current = xpathResult.iterateNext(); }} But the prevention is not working. Don't you know the reason? Thank you very much :-)
×
×
  • Create New...