I am going to explain about javascript code for Drag from ASP.Net ListBox and to Drop in the specific Cursor location of TextArea .
Finding Curosr Position Using JavaScript and Drag and Drop Values
Introduction:
I am going to explain about javascript code for Drag from ASP.Net ListBox and to Drop in the specific Cursor location of TextArea .
Solution:
A ListBox having some Parameters or values which refers the corresponding database records.We have to Drag the valuesfrom ListBox and Drop in the TextArea . In Text area we have to find the cursor position and Drop the Values from ListBox.
ASPX Code:
Email Message:
<asp:TextBox ID="txtMsg" runat="server" TextMode="MultiLine" Rows="10" Columns="50" onclick="storeCur(this);" onkeyup="storeCur(this);" onselect="storeCur(this);"></asp:TextBox>
List Values:
<asp:ListBox ID="lstParameter" runat="server" DataTextField="db_Values" DataValueField="db_Names" onmousedown="d = new drag(this)"
onmouseup="d.drop(this.form.txtMsg)" onmouseout="if (typeof d != 'undefined') d.setIndex()"> </asp:ListBox>
JavaScript Code:
<script language="javascript" type="text/javascript">
function storeCur(txtMsg)
{
if (txtMsg.createTextRange)
txtMsg.caretPos = document.selection.createRange().duplicate();
}
function drag(objSource)
{
this.select = objSource;
}
function drag.prototype.drop(objDest)
{
if (!this.dragStart) return;
this.dest = objDest;
var pt=this.option.cloneNode(true);
if (objDest.createTextRange && objDest.caretPos)
{
var caretPos = objDest.caretPos;
if(caretPos.text.charAt(caretPos.text.length - 1) == '')
{
caretPos.text = pt.value;
}
}
function drag.prototype.setIndex()
{
var i = this.select.selectedIndex;
window.status="selectedIndex = "+i;
if (i==-1) return;
this.option = this.select.options[i];
this.dragStart=true;
}
if (myField.selectionStart || myField.selectionStart == ‘0')
{
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
myField.value = myField.value.substring(0, startPos)+ myValue
+ myField.value.substring(endPos, myField.value.length);
}
else
{
myField.value += myValue;
}
}
</script>
Conclusion
Finally we find out the solution for Drag and Drop from Webcontrols and Locating the Cursor position.