edit-task

Task Description: ] jquery replaceWith vs html ]

Start Date:

Start Time:

Duration:

Priority:

Status: To Do Completed In Process

Add Photo:

Owner ID:

Content: use HTML Edit Content <h1 style="text-align: center;">code notes -</h1> <h2>[previously]</h2> <ol> <li><strong>[] $.post - <a href="http://stackoverflow.com/questions/21115104/submit-form-without-redirecting" target="_blank">great example</a>&nbsp;- submit form without re-directing</strong></li> <ol> <li>] add on submit event to form, prevent default event, &nbsp;</li> <li>] REF = stack overflow</li> </ol> <li><strong>[2015-03-05]&nbsp;jquery&nbsp;replaceWith("insert something") VERSUS .html("insert some html")</strong></li> <ol> <li>] .replaceWith() replaces the div element</li> <li>] .html() - replace the content inside the exisiting div element</li> <li>] REF = <a href="http://stackoverflow.com/questions/730916/whats-the-difference-between-jquerys-replacewith-and-html" target="_blank">http://stackoverflow.com/questions/730916/whats-the-difference-between-jquerys-replacewith-and-html</a>&nbsp;</li> </ol> <li><strong>[2015-03-05] reposition to original position in page after a post is submitted&nbsp;research</strong></li> <ol> <li><strong>] save scroll postion before click event,</strong></li> <ol> <li><span class="kwd">] var</span><span class="pln"> tempScrollTop </span><span class="pun">=</span><span class="pln"> $</span><span class="pun">(</span><span class="pln">window</span><span class="pun">).</span><span class="pln">scrollTop</span><span class="pun">();</span></li> <li><span class="pun">] ..</span><span class="com">//Your code</span></li> <li><span class="pln">] $</span><span class="pun">(</span><span class="pln">window</span><span class="pun">).</span><span class="pln">scrollTop</span><span class="pun">(</span><span class="pln">tempScrollTop</span><span class="pun">);</span></li> <li>] REF = <a href="http://stackoverflow.com/questions/10836428/how-to-maintain-page-scroll-position-after-a-jquery-event-is-carried-out" target="_blank">javascript - How to maintain page scroll position after a jquery event is carried out - Stack Overflow</a></li> </ol> <li><strong>&gt;] javascript:void(0) - IF element is an "a" element -</strong> WOOT, this is the easiest and it works</li> <ol> <li>] href="javascript:void(0)" VS href="#"</li> <li>] REF = <a href="http://stackoverflow.com/questions/10836428/how-to-maintain-page-scroll-position-after-a-jquery-event-is-carried-out" target="_blank">http://stackoverflow.com/questions/10836428/how-to-maintain-page-scroll-position-after-a-jquery-event-is-carried-out</a>&nbsp;</li> </ol></ol> <li><strong>[reposition] navigation TRY</strong></li> <ol> <li>] // PASS&nbsp;- window.location.href = "index.cshtml/#getEmail";&nbsp;BUT reloads the page</li> <li>]&nbsp;// FAIL&nbsp;- window.location.hash = "#getEmail";</li> <li>] <a href="http://stackoverflow.com/questions/14860192/how-to-navigate-to-an-element-in-a-page-using-javascript-without-changing-page-h" target="_blank">using scrollIntoView</a></li> <li>]&nbsp;// FAIL - var moveBack = document.getElementById("getEmail");&nbsp;This should work but doesnt, <a href="http://stackoverflow.com/questions/9445842/does-scrollintoview-work-in-all-browsers?lq=1" target="_blank">problematic api</a>&nbsp;(ie ?, )</li> <ol> <li>] moveBack.scrollIntoView(true);</li> </ol> <li>]&nbsp;// FAIL&nbsp;- document.getEmail.scrollIntoView();</li> </ol></ol> <h2>[currently]</h2> <ol> <li>] &nbsp;</li> </ol> <h2>[next]</h2> <ol> <li>]</li> </ol>