views:

238

answers:

1

I am trying to copy the masterdiv contents including child divs. Below is the code implementation.

<label id="lblMessage" />
<table width="100%">
    <tr>
        <td>
            <div id="colorSelector">
                <div style="background-color: rgb(0, 0, 255);" />
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div id="dynPageContent"></div>
            <input type="button" id="updContent" value="Update" />
        </td>
    </tr>
</table>

<script type="text/javascript" language="javascript">
    $(document).ready(
    function() {
        $('#colorSelector').ColorPicker({
            color: '#0000ff',
            onShow: function(colpkr) {
                $(colpkr).fadeIn(500);
                return false;
            },
            onHide: function(colpkr) {
                $(colpkr).fadeOut(500);
                return false;
            },
            onChange: function(hsb, hex, rgb) {
                $('#dynPageContent div').css('backgroundColor', '#' + hex);
            }
        });
        if ($("#dynPageContent").length) {
            $("#dynPageContent").html('<%= Model.Page_Content.Trim() %>');
            if ($("#pageContent").length) {
                $("#pageContent").load("/Home/PageContent");
            }
            if ($("#Sidebar").length) {
                $("#Sidebar").load("/Home/Sidebar");
            }
        }

        $('#updContent').unbind('click');
        $('#updContent').click(function(e) {
            var updatedpageContent = $('<div />').append($('#dynPageContent div[id^="pageContent"],div[id^="sideba"]').clone()).remove().html();
            $.getJSON("/Home/UpdatePage/?t=" + new Date(), { pc: updatedpageContent },
            function(data) {
                if (data != null) {
                    if (data == true) {
                        $('#lblMessage').html("Page template updated.");
                    }
                }
            });
        });
    });
</script>

I am loading the html/divs(place holders for the content) from the database and i can change the background color of the child divs and update the placeholders/child divs with new style(background color) to the database using json.

The above code works fine in Firefox, but in IE and chrome, the masterdiv(dynPageContent) disappears.

Whats wrong with the above code?

A: 

Finally i got it solved.

The problem is with the html tag of label.

I have replaced

<label id="lblMessage" />

with

<label id="lblMessage"></label>

That solved the problem. Strange one..

Prasad