1

I am doing a simple thing but facing various challenges along with it .All I wanna do is to store all required range object parameters inorder to reconstruct user selection. Currently I am storing id of start and endContainer and start and endOffset.But these params seems to be not enough as in case user selection spans to any childNodes within the start/endContainer its offset is calculated relative to that childNode and not start/endContainer id. So can anyone help me to figure out what all or extra params I would need to unqiuely identify my selection i.e nextSibling ,previousSibling of container etc ??

My current code for regenration of range object here is :- 

function buildRange(startOffset, endOffset, startContainerId, endContainerId){

    var startContainer = document.getElementById(startContainerId);    
    var endContainer = document.getElementById(endContainerId);
    // create the range    
    var range = document.createRange();   
    range.setStart(startContainer.firstChild, startOffset);
    range.setEnd(endContainer.firstChild, endOffset);

    return range;
}
captainsac
  • 2,484
  • 3
  • 27
  • 48
user2732694
  • 11
  • 1
  • http://stackoverflow.com/a/13950376/96100 http://stackoverflow.com/questions/16095155/javascript-contenteditable-set-cursor-caret-to-index/16100733#16100733 – Tim Down Jun 09 '15 at 08:16
  • Thanks alot @Tim Down for replying. My purpose/usecase is rather simple and I guess commonly used by people. I wanna add comments on selected portion of HTML file . For this User will select some content on HTML file .and a Dialog will pop up to input comment text.Once dialog is submitted the user selection and comment text is stored in DB. As soon as dialog gets disposed , I wanna highlight the user selection and wanna show comment text on top of highlighted portion ( something like clickable mouse tooltip or something.) – user2732694 Jun 16 '15 at 07:40
  • I went through your rangy wiki and found pretty much the work I wanna do.Currently I have used the serialiser module to gather and serialise the user selection and storing the same in DB .Now when I am applying classApplier module on the selected selection to highlight the selection it isn't working as desired.I observed if I am calling this classApplier in the same window where txt is selected (i.e without passing any window reference to the method it works fine).But since I am calling this method from a different window ( passing the correct window reference also) its not working as desired. – user2732694 Jun 16 '15 at 07:54
  • AddComment.js -$(document).ready(function() {rangy.init(); var serializerModule = rangy.modules.Serializer; var addCommentBtn = gEBI("AddComment"); addCommentBtn.disabled = false; addCommentBtn.ontouchstart = addCommentBtn.onclick = serializeSelection; function serializeSelection() { var serialisedSelection = rangy.serializeSelection(); sessionStorage.setItem("serialisedSelection", serialisedSelection); showCommentDialog("comment"); } – user2732694 Jun 16 '15 at 07:55
  • postComments.js - $.ajax({ type: "POST", url: "comment", data: "serialisedSelection=" + sessionStorage.getItem("serialisedSelection") + "&artifactUUID=" + sessionStorage.getItem("artifactUUID") + "&type=" + $("#_type").val()+ "&disposition="+ $("#_disp").val()+"&description="+ tinyMCE.get('commText').getContent(), success: function(response){var commentModel = JSON.parse(response); var serialisedString = commentModel.serialisedSelection; rangy.deserializeSelection(serialisedString,window);rangy.restoreSelectionFromCookie(); applier.applyToSelection(window); }, – user2732694 Jun 16 '15 at 08:00

0 Answers0