I have been dedicating my time to self-teach ASP.NET and JavaScript for a project, and I've hit a roadblock that has consumed dozens of hours.
After discovering a fantastic drag-and-drop JavaScript list online, I copied the provided source code and organized the CSS into a .css file, the JavaScript into a .js file, and integrated the HTML and reference into my ASP.NET page. It worked flawlessly. Fantastic!
Subsequently, I replaced the JavaScript list with a static HTML list containing the same data, enclosed it in an UpdatePanel, and configured an "edit order" button to switch the static list's HTML with the JavaScript list's HTML upon button press.
No luck!
Initially, runtime errors occurred indicating that certain objects could not be located. For instance:
Microsoft JScript runtime error: Unable to get value of the property 'getElementsByTagName': object is null or undefined
I grasped this issue as the elements weren't present yet. Therefore, I removed the .js reference from the main header and attempted to register the .js file when the update panel changed instead.
This predicament perplexes me.
The majority of online explanations focus on RegisterClientScriptBlock, RegisterStartupScript, RegisterClientScriptInclude, or myLiteral, but none seem to solve my dilemma. Additionally, many resources detail how to execute a single JavaScript function, whereas the script I'm attempting to utilize consists of 700 lines! Must I individually reference each one?
Pardon me for posing what may seem like a novice question. I waited until I'd vehemently shouted at the screen enough times before seeking assistance!
Warm regards.
EDIT: CODE
As requested, here is the code:
VB.net (contained within a sub invoked by the button press. This is where the script needs to be registered)
Dim script As String = ""
Dim Labelb As Label = CType(FindControl("Labelb"), Label)
Dim con As SqlConnection
Dim cmd As SqlCommand
con = New SqlConnection("[connection string here]")
con.Open()
Dim lrd As SqlDataReader
cmd = New SqlCommand("[command string here]", con)
lrd = cmd.ExecuteReader
Dim item = ""
While lrd.Read()
item = item & "<li style=""position: relative;"">" & lrd(1) & "</li>"
End While
lrd.Close()
item = "<table id=""phonetics""><tbody><tr><td><ul id=""phonetic3"" class=""boxy"">" & item & "</ul></td></tr></tbody></table><br/>"
Labelb.Text = item
This represents the HTML update panel in the ASP.NET master page:
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"/>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Labelb" runat="server" Text="" />
</ContentTemplate>
</asp:UpdatePanel>
Finally, this is the .js file requiring registration:
var ToolMan = {
// The rest of the JavaScript code goes here beyond this point...
}
Window.onload = function() {
junkdrawer.restoreListOrder("phonetic3")
//junkdrawer.restoreListOrder("twolists1")
//junkdrawer.restoreListOrder("twolists2")
dragsort.makeListSortable(document.getElementById("phonetic3"),
verticalOnly, saveOrder)
/*
dragsort.makeListSortable(document.getElementById("twolists1"),
saveOrder)
dragsort.makeListSortable(document.getElementById("twolists2"),
saveOrder)
*/
}
function verticalOnly(item) {
item.toolManDragGroup.verticalOnly()
}
function speak(id, what) {
var element = document.getElementById(id);
element.innerHTML = 'Clicked ' + what;
}
function saveOrder(item) {
var group = item.toolManDragGroup
var list = group.element.parentNode
var id = list.getAttribute("id")
if (id == null) return
group.register('dragend', function() {
ToolMan.cookies().set("list-" + id,
junkdrawer.serializeList(list), 365)
})
}
//-->
Your support is greatly appreciated!
Best wishes,