Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Code razor within Javascript code

The code below does not work.

I've tried all forms

@: @() @{} <text> </text>

The apparent problem is the { and } at the beginning and end. (Required, as are parameters)

<script type="text/javascript">

    function initializeFileUploader()
    {
        SetUploader('/Projects/ImageUpload', 'Images', true, ['jpg', 'jpeg', 'png', 'gif', 'zip'], { ProjectID: @Model.ID } );
        SetUploader('/Projects/ImageUpload', 'Logo', false, ['jpg', 'jpeg', 'png', 'gif'], { Logo: true, ProjectID: "@(Model.ID)" } );
    }
    window.onload = initializeFileUploader;

</script>

How to use, @Model.ID in my JavaScript?

[Edit] Adding info

With this code:

<script type="text/javascript">

    function initializeFileUploader()
    {
        SetUploader('/Projects/ImageUpload', 'Images', true, ['jpg', 'jpeg', 'png', 'gif', 'zip'], { ProjectID: @HttpUtility.JavaScriptStringEncode(Model.ID.ToString(), true) });
        SetUploader('/Projects/ImageUpload', 'Logo', false, ['jpg', 'jpeg', 'png', 'gif'], { Logo: true, ProjectID: @HttpUtility.JavaScriptStringEncode(Model.ID.ToString(), true) } );
    }

    window.onload = initializeFileUploader();

</script>

The razor generate this code:

<script type="text/javascript">

        function initializeFileUploader()
        {
            SetUploader('/Projects/ImageUpload', 'Images', true, ['jpg', 'jpeg', 'png', 'gif', 'zip'], { ProjectID: &quot;860c13af-9aa9-4667-8ee8-c5629515c71b&quot; 

</body>
</html>

[Add] Another example of code

$('#Logo').bindAjaxUploader({
    action: '/Project/ImageUpload',
    allowedExtensions:  ['jpg', 'jpeg', 'png', 'gif'],
    params: { Logo: true, ProjectID: @HttpUtility.JavaScriptStringEncode(Model.ID.ToString(), true) }
});

If you set the value manually, everything works perfectly!

$('#Logo').bindAjaxUploader({
    action: '/Project/ImageUpload',
    allowedExtensions:  ['jpg', 'jpeg', 'png', 'gif'],
    params: { Logo: true, ProjectID: "559b0505-09f2-4385-aee0-530d79c82803" }
});

[Edit] Resolution

To correct the problem, I had to do this: (not an elegant way)

@{
    @:function initializeFileUploader()
    @:{
            @:SetUploader('/Projects/ImageUpload', 'Images', true, ['jpg', 'jpeg', 'png', 'gif', 'zip'], { ProjectID: "@(HttpUtility.JavaScriptStringEncode(Model.ID.ToString()))" });
            @:SetUploader('/Projects/ImageUpload', 'Logo', false, ['jpg', 'jpeg', 'png', 'gif'], { Logo: true, ProjectID: "@(HttpUtility.JavaScriptStringEncode(Model.ID.ToString()))" });
        @:}

    @:window.onload = initializeFileUploader;
}
like image 594
ridermansb Avatar asked Sep 27 '26 08:09

ridermansb


1 Answers

window.onload = initializeFileUploader();

This is executing initializeFileUploader() straight away, BEFORE window.onload is actually called, it should be

window.onload = initializeFileUploader;
like image 174
AlanFoster Avatar answered Sep 29 '26 20:09

AlanFoster



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!