Calling a javascript function and pass value to function from partial view

up vote
0
down vote

favorite

I have defined a function formatPrice in accountJS file, which I want to call while binding jquery datatable in a partial view. Along with that I want to pass the @item.price value to this function.

Below is the code:

@model List<Products>



<table id="datatableResult" class="searchgrid">

<thead>

<tr>

    <th>Id</th>

</tr>

<tr>

    <th>Product Price</th>

</tr>

</thead>

<tbody>

@if (Model != null)

{

     foreach (var item in Model)

    {

      <tr>

         <td>@item.Id</td>

         <td>accountJS.formatPrice(@item.price)</td>

      </tr>

    }

 }

</tbody>

</table>

edited Nov 21 at 9:05

Tetsuya Yamamoto

13.4k41939

asked Nov 21 at 7:20

sunshine

49414

1

<td>accountJS.formatPrice(@item.price)</td> => this function call is totally wrong because it's not called inside JS <script> block. Which event you want to trigger using @item.price value?
– Tetsuya Yamamoto
Nov 21 at 7:25

@TetsuyaYamamoto - Can you please guide me how it should be called ?<script>accounting.formatMoney(@item.acc_total_balance)</script> it does not work
– sunshine
Nov 21 at 7:26

The first thing you should have is the script embedding tag: <script src="~/path/to/accountJS.js"></script>. Then inside JS script tag you may call formatPrice() with row data, but I want to know how you trigger the formatPrice() for corresponding row (using action link or other elements).
– Tetsuya Yamamoto
Nov 21 at 7:30

@TetsuyaYamamoto - The file gets included in main View. So I dont think I will have to add <script src="~/path/to/accountJS.js">. So I expect while rendering the datatable, the Price will be pass to fomatPrice function which should Format the price. No Action required as this code I want to write while binding the DataTable.
– sunshine
Nov 21 at 7:35

1

You should set the row as <td>@item.price</td>, and use client-side formatting inside render function. The @item.price value can be passed using column index contained inside row parameter, e.g. render: function (data, type, row, meta) { return formatPrice(row[1]); }.
– Tetsuya Yamamoto
Nov 21 at 8:42

|
show 4 more comments

up vote
0
down vote

favorite

Below is the code:

@model List<Products>



<table id="datatableResult" class="searchgrid">

<thead>

<tr>

    <th>Id</th>

</tr>

<tr>

    <th>Product Price</th>

</tr>

</thead>

<tbody>

@if (Model != null)

{

     foreach (var item in Model)

    {

      <tr>

         <td>@item.Id</td>

         <td>accountJS.formatPrice(@item.price)</td>

      </tr>

    }

 }

</tbody>

</table>

edited Nov 21 at 9:05

Tetsuya Yamamoto

13.4k41939

asked Nov 21 at 7:20

sunshine

49414

1

<td>accountJS.formatPrice(@item.price)</td> => this function call is totally wrong because it's not called inside JS <script> block. Which event you want to trigger using @item.price value?
– Tetsuya Yamamoto
Nov 21 at 7:25

@TetsuyaYamamoto - Can you please guide me how it should be called ?<script>accounting.formatMoney(@item.acc_total_balance)</script> it does not work
– sunshine
Nov 21 at 7:26

The first thing you should have is the script embedding tag: <script src="~/path/to/accountJS.js"></script>. Then inside JS script tag you may call formatPrice() with row data, but I want to know how you trigger the formatPrice() for corresponding row (using action link or other elements).
– Tetsuya Yamamoto
Nov 21 at 7:30

@TetsuyaYamamoto - The file gets included in main View. So I dont think I will have to add <script src="~/path/to/accountJS.js">. So I expect while rendering the datatable, the Price will be pass to fomatPrice function which should Format the price. No Action required as this code I want to write while binding the DataTable.
– sunshine
Nov 21 at 7:35

1

You should set the row as <td>@item.price</td>, and use client-side formatting inside render function. The @item.price value can be passed using column index contained inside row parameter, e.g. render: function (data, type, row, meta) { return formatPrice(row[1]); }.
– Tetsuya Yamamoto
Nov 21 at 8:42

|
show 4 more comments

up vote
0
down vote

favorite

Below is the code:

@model List<Products>



<table id="datatableResult" class="searchgrid">

<thead>

<tr>

    <th>Id</th>

</tr>

<tr>

    <th>Product Price</th>

</tr>

</thead>

<tbody>

@if (Model != null)

{

     foreach (var item in Model)

    {

      <tr>

         <td>@item.Id</td>

         <td>accountJS.formatPrice(@item.price)</td>

      </tr>

    }

 }

</tbody>

</table>

edited Nov 21 at 9:05

Tetsuya Yamamoto

13.4k41939

asked Nov 21 at 7:20

sunshine

49414

Below is the code:

@model List<Products>



<table id="datatableResult" class="searchgrid">

<thead>

<tr>

    <th>Id</th>

</tr>

<tr>

    <th>Product Price</th>

</tr>

</thead>

<tbody>

@if (Model != null)

{

     foreach (var item in Model)

    {

      <tr>

         <td>@item.Id</td>

         <td>accountJS.formatPrice(@item.price)</td>

      </tr>

    }

 }

</tbody>

</table>

jquery asp.net-mvc datatables

edited Nov 21 at 9:05

Tetsuya Yamamoto

13.4k41939

asked Nov 21 at 7:20

sunshine

49414

edited Nov 21 at 9:05

Tetsuya Yamamoto

13.4k41939

asked Nov 21 at 7:20

sunshine

49414

edited Nov 21 at 9:05

Tetsuya Yamamoto

13.4k41939

edited Nov 21 at 9:05

Tetsuya Yamamoto

13.4k41939

edited Nov 21 at 9:05

Tetsuya Yamamoto

13.4k41939

asked Nov 21 at 7:20

sunshine

49414

asked Nov 21 at 7:20

sunshine

49414

asked Nov 21 at 7:20

sunshine

49414

1

<td>accountJS.formatPrice(@item.price)</td> => this function call is totally wrong because it's not called inside JS <script> block. Which event you want to trigger using @item.price value?
– Tetsuya Yamamoto
Nov 21 at 7:25

@TetsuyaYamamoto - Can you please guide me how it should be called ?<script>accounting.formatMoney(@item.acc_total_balance)</script> it does not work
– sunshine
Nov 21 at 7:26

The first thing you should have is the script embedding tag: <script src="~/path/to/accountJS.js"></script>. Then inside JS script tag you may call formatPrice() with row data, but I want to know how you trigger the formatPrice() for corresponding row (using action link or other elements).
– Tetsuya Yamamoto
Nov 21 at 7:30

@TetsuyaYamamoto - The file gets included in main View. So I dont think I will have to add <script src="~/path/to/accountJS.js">. So I expect while rendering the datatable, the Price will be pass to fomatPrice function which should Format the price. No Action required as this code I want to write while binding the DataTable.
– sunshine
Nov 21 at 7:35

1

You should set the row as <td>@item.price</td>, and use client-side formatting inside render function. The @item.price value can be passed using column index contained inside row parameter, e.g. render: function (data, type, row, meta) { return formatPrice(row[1]); }.
– Tetsuya Yamamoto
Nov 21 at 8:42

|
show 4 more comments

1

<td>accountJS.formatPrice(@item.price)</td> => this function call is totally wrong because it's not called inside JS <script> block. Which event you want to trigger using @item.price value?
– Tetsuya Yamamoto
Nov 21 at 7:25

@TetsuyaYamamoto - Can you please guide me how it should be called ?<script>accounting.formatMoney(@item.acc_total_balance)</script> it does not work
– sunshine
Nov 21 at 7:26

The first thing you should have is the script embedding tag: <script src="~/path/to/accountJS.js"></script>. Then inside JS script tag you may call formatPrice() with row data, but I want to know how you trigger the formatPrice() for corresponding row (using action link or other elements).
– Tetsuya Yamamoto
Nov 21 at 7:30

@TetsuyaYamamoto - The file gets included in main View. So I dont think I will have to add <script src="~/path/to/accountJS.js">. So I expect while rendering the datatable, the Price will be pass to fomatPrice function which should Format the price. No Action required as this code I want to write while binding the DataTable.
– sunshine
Nov 21 at 7:35

1

You should set the row as <td>@item.price</td>, and use client-side formatting inside render function. The @item.price value can be passed using column index contained inside row parameter, e.g. render: function (data, type, row, meta) { return formatPrice(row[1]); }.
– Tetsuya Yamamoto
Nov 21 at 8:42

<td>accountJS.formatPrice(@item.price)</td> => this function call is totally wrong because it's not called inside JS <script> block. Which event you want to trigger using @item.price value?
– Tetsuya Yamamoto
Nov 21 at 7:25

@TetsuyaYamamoto - Can you please guide me how it should be called ?<script>accounting.formatMoney(@item.acc_total_balance)</script> it does not work
– sunshine
Nov 21 at 7:26

The first thing you should have is the script embedding tag: <script src="~/path/to/accountJS.js"></script>. Then inside JS script tag you may call formatPrice() with row data, but I want to know how you trigger the formatPrice() for corresponding row (using action link or other elements).
– Tetsuya Yamamoto
Nov 21 at 7:30

@TetsuyaYamamoto - The file gets included in main View. So I dont think I will have to add <script src="~/path/to/accountJS.js">. So I expect while rendering the datatable, the Price will be pass to fomatPrice function which should Format the price. No Action required as this code I want to write while binding the DataTable.
– sunshine
Nov 21 at 7:35

You should set the row as <td>@item.price</td>, and use client-side formatting inside render function. The @item.price value can be passed using column index contained inside row parameter, e.g. render: function (data, type, row, meta) { return formatPrice(row[1]); }.
– Tetsuya Yamamoto
Nov 21 at 8:42

|
show 4 more comments

1 Answer
1

active

oldest

votes

up vote
0
down vote

As far as I had seen, accountJS.formatPrice(@item.price) is not a valid function call because it was called outside the <script> block, and rendered as plain text. Therefore, the table element must be set as follows:

@if (Model != null)

{

    foreach (var item in Model)

    {

      <tr>

         <td>@item.Id</td>

         <td>@item.price</td>

      </tr>

    }

}

Then, in DataTable function you can use column index from row parameter inside render setting to get the price and pass it to external JS function:

<script>

$(function () {

    $('#datatableResult').DataTable({

        // other settings



        columnDefs": [{ 

           "targets": 1, 

           "render": function (data, type, row, meta) { 

               // pass the column index here

               return accountJS.formatPrice(row[1]); 

           } 

        }]



        // other settings

    });

});

<script>

Reference:

DataTable - Column rendering

Related issue:

Jquery Datatables How to get column Id in render function

edited Nov 21 at 9:03

answered Nov 21 at 8:58

Tetsuya Yamamoto

13.4k41939

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53407042%2fcalling-a-javascript-function-and-pass-value-to-function-from-partial-view%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

up vote
0
down vote

@if (Model != null)

{

    foreach (var item in Model)

    {

      <tr>

         <td>@item.Id</td>

         <td>@item.price</td>

      </tr>

    }

}

Then, in DataTable function you can use column index from row parameter inside render setting to get the price and pass it to external JS function:

<script>

$(function () {

    $('#datatableResult').DataTable({

        // other settings



        columnDefs": [{ 

           "targets": 1, 

           "render": function (data, type, row, meta) { 

               // pass the column index here

               return accountJS.formatPrice(row[1]); 

           } 

        }]



        // other settings

    });

});

<script>

Reference:

DataTable - Column rendering

Related issue:

Jquery Datatables How to get column Id in render function

edited Nov 21 at 9:03

answered Nov 21 at 8:58

Tetsuya Yamamoto

13.4k41939

add a comment |

up vote
0
down vote

@if (Model != null)

{

    foreach (var item in Model)

    {

      <tr>

         <td>@item.Id</td>

         <td>@item.price</td>

      </tr>

    }

}

Then, in DataTable function you can use column index from row parameter inside render setting to get the price and pass it to external JS function:

<script>

$(function () {

    $('#datatableResult').DataTable({

        // other settings



        columnDefs": [{ 

           "targets": 1, 

           "render": function (data, type, row, meta) { 

               // pass the column index here

               return accountJS.formatPrice(row[1]); 

           } 

        }]



        // other settings

    });

});

<script>

Reference:

DataTable - Column rendering

Related issue:

Jquery Datatables How to get column Id in render function

edited Nov 21 at 9:03

answered Nov 21 at 8:58

Tetsuya Yamamoto

13.4k41939

add a comment |

up vote
0
down vote

@if (Model != null)

{

    foreach (var item in Model)

    {

      <tr>

         <td>@item.Id</td>

         <td>@item.price</td>

      </tr>

    }

}

Then, in DataTable function you can use column index from row parameter inside render setting to get the price and pass it to external JS function:

<script>

$(function () {

    $('#datatableResult').DataTable({

        // other settings



        columnDefs": [{ 

           "targets": 1, 

           "render": function (data, type, row, meta) { 

               // pass the column index here

               return accountJS.formatPrice(row[1]); 

           } 

        }]



        // other settings

    });

});

<script>

Reference:

DataTable - Column rendering

Related issue:

Jquery Datatables How to get column Id in render function

edited Nov 21 at 9:03

answered Nov 21 at 8:58

Tetsuya Yamamoto

13.4k41939

@if (Model != null)

{

    foreach (var item in Model)

    {

      <tr>

         <td>@item.Id</td>

         <td>@item.price</td>

      </tr>

    }

}

Then, in DataTable function you can use column index from row parameter inside render setting to get the price and pass it to external JS function:

<script>

$(function () {

    $('#datatableResult').DataTable({

        // other settings



        columnDefs": [{ 

           "targets": 1, 

           "render": function (data, type, row, meta) { 

               // pass the column index here

               return accountJS.formatPrice(row[1]); 

           } 

        }]



        // other settings

    });

});

<script>

Reference:

DataTable - Column rendering

Related issue:

Jquery Datatables How to get column Id in render function

edited Nov 21 at 9:03

answered Nov 21 at 8:58

Tetsuya Yamamoto

13.4k41939

edited Nov 21 at 9:03

answered Nov 21 at 8:58

Tetsuya Yamamoto

13.4k41939

answered Nov 21 at 8:58

Tetsuya Yamamoto

13.4k41939

answered Nov 21 at 8:58

Tetsuya Yamamoto

13.4k41939

add a comment |

draft saved

draft discarded

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Htykuut