I suggest you make a stripped-down version instead of expecting people to pore over hundreds of lines of code, which you didn't even bother to remove the commented-out parts.
On May 6, 3:27 am, sandy <[email protected]> wrote: > Hi all , > > I am doing image drag and drop functionality in asp.net, the drag > functionality is working fine but my drop functionality is not working > fine so i need help. > I am getting the error in prototype.js file in line number 1903 "var > value = element.style[style];" element is null. and i ma stuck on this > from last one week.....the whole code of my aspx file is here... > > <%@ Page Language="C#" AutoEventWireup="true" > CodeBehind="ImageUpload.aspx.cs" > Inherits="WebPages2.Advertiser.ImageUpload" MasterPageFile="~/ > Advertiser/AdvertiserMaster.Master" %> > > <asp:Content ID="AdvImgUploadHead" ContentPlaceHolderID="AdvHead" > runat="server"> > > <script src="/Scripts/prototype.js" type="text/javascript"></ > script> > <script src="/Scripts/scriptaculous.js?load=effects,dragdrop" > type="text/javascript"></script> > > <script type="text/javascript" language="javascript"> > function triggerFileUpload(sender,args) > { > var objfile = document.getElementById('File1'); > objfile.click(); > } > > // function setHiddenValue1() > // { > // alert("hi"); > // document.getElementById("HiddenField2").value = > document.getElementById("adv_img_2").value; > // } > </script> > > </asp:Content> > > <asp:Content ID="AdvImgUploadMainPageContent" > ContentPlaceHolderID="AdvMainPageContent" runat="server"> > <asp:UpdatePanel ID="UpdatePanel1" runat="server" > UpdateMode="Conditional"> > <Triggers> > <asp:AsyncPostBackTrigger ControlID="ReplaceButton" EventName="Click" / > > </Triggers> > > </asp:UpdatePanel> > <h1> > Image View > </h1> > <div id="frmcontrols" class="transaction-table-pane"> > <asp:Panel ID="Panel2" runat="server" > > <table class="image-view-pane" > > <tr> > <td> > <div id="Div1" style="Width:50;Height:60" > class="transaction-table-pane"> > <asp:ImageButton ID="adv_img_100" > CssClass="adv_imgs" ImageUrl="../Resources/ImageUploadData/ > adv_aqua.png" Width="97" Height="60" runat="server" /> > </div> > </td> > <td> > <p>Default Ad</p> > </td> > </tr> > <tr> > <td> > <asp:Panel ID="ImagePanel" runat="server" > CssClass="adv_imgs" > > </asp:Panel> > > </td> > </tr> > > <tr> > > </tr> > </table> > </asp:Panel> > <div id="delbuttondiv" style="display:none"> > <asp:Button ID="DeleteButton" runat="server" Text="Delete" > OnClick="DeleteButton_Click" CssClass="image_upload_buttons" /> > </div> > <div id="uplbuttonDiv" style="display:none"> > <asp:Button ID="UploadButton" runat="server" Text="Upload" > OnClientClick="triggerFileUpload()" OnClick="UploadButton_Click" > CssClass="image_upload_buttons" /> > </div> > <div id="repbuttonDiv" style="display:none"> > <asp:Button ID="ReplaceButton" runat="server" Text="Replace" > OnClientClick="triggerFileUpload()" OnClick="ReplaceButton_Click" > CssClass="image_upload_buttons" /> > > <input id="File1" type="file" onchange="setHiddenValue()" > style="visibility:hidden;" /> > </div> > > </div> > <div> > <asp:HiddenField ID="HiddenField1" runat="server" /> > <asp:HiddenField ID="HiddenField2" runat="server" /> > <asp:HiddenField ID="HiddenField3" runat="server" /> > <asp:HiddenField ID="HiddenField4" runat="server" /> > </div> > <h1> > Auction View > </h1> > <%--<asp:Panel ID="Panel3" runat="server">--%> > <asp:Panel ID="Panel3" runat="server"> > <div style="height:auto" class="transaction-table-pane"> > <div id="auction_images_cont_1" runat="server" class="very- > thin-border" style="width:65%"> > <h2>Auction_name_1</h2> > <div id="auction_images_1" runat="server" > > </div> > </div> > <%--<br /> > <div id="auction_images_cont_2" runat="server" class="very- > thin-border" style="width:65%"> > <h2>Auction_name_2</h2> > <div id="auction_images_2" runat="server"> > </div> > </div> > <div id="rembuttonDiv" style="display:none" runat="server"> > <asp:Button ID="RemoveButton" runat="server" Visible="false" > Text="Remove" CssClass="image_upload_buttons"/> > </div>--%> > </div> > </asp:Panel> > <%-- </div> > </asp:Panel>--%> > > <script type="text/javascript"> > /* > This code should ideally be registered on the server side. > */ > // function wedge(event){ > // Event.stop(event); > // return false; > // } > > // function onStartFunction(){ > // if (document.all){ > // Event.observe(document.body, "drag", wedge, false); > // Event.observe(document.body, "selectstart", wedge, > false); > // } > // } > // > // function onEndFunction(){ > // if (document.all){ > // Event.stopObserving(document.body, "drag", wedge, > false); > // Event.stopObserving(document.body, "selectstart", > wedge, false); > // } > // } > // function wedge(event) > // { return false > // } > // > // new Draggable("ImageButton1", > // { > // revert: true, > // onStart: onStartFunction, onEnd: onEndFunction > // }); > // new Draggable("adv_img_3", > // { > // revert: true, > // onStart: onStartFunction, onEnd: onEndFunction > // }); > // new Draggable("adv_img_4", > // { > // revert: true, > // onStart: onStartFunction, onEnd: onEndFunction > // }); > // new Draggable("adv_img_5", > // { > // revert: true, > // onStart: onStartFunction, onEnd: onEndFunction > // }); > // new Draggable("adv_img_6", > // { > // revert: true, > // onStart: onStartFunction, onEnd: onEndFunction > // }); > // new Draggable("adv_img_7", > // { > // revert: true, > // onStart: onStartFunction, onEnd: onEndFunction > // }); > // new Draggable("adv_img_8", > // { > // revert: true, > // onStart: onStartFunction, onEnd: onEndFunction > // }); > // new Draggable("adv_img_9", > // { > // revert: true, > // onStart: onStartFunction, onEnd: onEndFunction > // }); > // > // function getImageId(image_id){ > // var tokens = image_id.split("_"); > // return tokens[tokens.length - 1]; > // } > > // function createImageElement(image_id, image_src, image_class) > { > // var element = document.createElement("img"); > // element.setAttribute("id", "auction_data_" + image_id); > // element.setAttribute("class", image_class); > // element.setAttribute("src", encodeURI(image_src)); > // element.style.margin = "3px"; > // > // return element; > // } > > // Droppables.add('auction_images_cont_1', { > // accept: 'adv_imgs', > // hoverclass: 'drag_drop_hover', > // onDrop: function(element) { > // var parent = document.getElementById > ("auction_images_1"); > // parent.appendChild(createImageElement(element.id, > element.src, "adv_imgs")); > // $('auction_images_cont_1').highlight(); > // } > // }); > // > // Droppables.add('auction_images_cont_2', { > // accept: 'adv_imgs', > // hoverclass: 'drag_drop_hover', > // onDrop: function(element) { > // var parent = document.getElementById > ("auction_images_2"); > // parent.appendChild(createImageElement(element.id, > element.src, "adv_imgs")); > // $('auction_images_cont_2').highlight(); > // } > // }); > </script> > <script type="text/javascript"> > /* > This code should ideally be registered on the server side. > */ > function wedge(event){ > Event.stop(event); > return false; > } > > function onStartFunction(){ > if (document.all){ > Event.observe(document.body, "drag", wedge, false); > Event.observe(document.body, "selectstart", wedge, > false); > } > } > > function onEndFunction(){ > if (document.all){ > Event.stopObserving(document.body, "drag", wedge, > false); > Event.stopObserving(document.body, "selectstart", > wedge, false); > } > } > > new Draggable(document.getElementById("<%=HiddenField4.Value > %>"), > { > revert: true, > onStart: onStartFunction, onEnd: onEndFunction > }); > > function wedge(event){ > Event.stop(event); > return false; > } > > function getImageId(image_id){ > var tokens = image_id.split("_"); > return tokens[tokens.length - 1]; > } > > function createImageElement(image_id, image_src, image_class){ > var element = document.createElement > (document.getElementById("<%= HiddenField3.Value%>")); > // var element = document.createElement("img"); > element.setAttribute("id", "auction_data_" + image_id); > element.setAttribute("class", image_class); > element.setAttribute("src", encodeURI(image_src)); > element.style.margin = "3px"; > > return element; > } > > Droppables.add('auction_images_cont_1', { > accept: 'adv_imgs', > hoverclass: 'drag_drop_hover', > onDrop: function(element) { > var parent = document.getElementById > ("auction_images_1"); > parent.appendChild(createImageElement(element.id, > element.src, "adv_imgs")); > $('auction_images_cont_1').highlight(); > } > }); > // > Droppables.add('auction_images_cont_2', { > accept: 'adv_imgs', > hoverclass: 'drag_drop_hover', > onDrop: function(element) { > var parent = document.getElementById > ("auction_images_2"); > parent.appendChild(createImageElement(element.id, > element.src, "adv_imgs")); > $('auction_images_cont_2').highlight(); > } > }); > </script> > </asp:Content> > > <%-- onmouseover="this.className='imageOn'" > onmouseout="this.className='imageOff'"--%> --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~----------~----~----~----~------~----~------~--~---
