how show chart image in cell of schedular month of dhtmlx

Question

0.00/5 (No votes)

See more:

Hi, i am working on mvc3 project,in which i using schedular month to show charts in it.But i am
not able to show charts in schedular cell for each date of schedular month,because charts image generated in run time by this <img src="@Url.Action("CallReceiveDate", "Calendar", new { id = @id})" alt="SimpleChart" /> code, where CallReceiveDate is method of type Fileresult and Calendar is the controller and id is selected from dopdownlist,According to which charts is showing in schedular month

i am using this code

C#

scheduler.config.xml_date = "%m/%d/%Y %H:%i";
scheduler.init("scheduler_here", new Date(2010, 6, 1), "month");
scheduler.load("/Calendar/CallReceiveDate");

questions
1.how pass id to CallReceiveDate method.
2.how show charts image in each cells of schedular month by call this

HTML

<img src="@Url.Action("CallReceiveDate", "Calendar", new { id = @id})" alt="SimpleChart" />

Thanks in Advance

Posted 31-Dec-11 20:13pm

munish1990

Updated 31-Dec-11 21:37pm

v5

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Ivan Petrenko · Answer 1 · 2012-01-09T01:47:00

1.how pass id to CallReceiveDate method.

The parameters can be passed in URL, and they will the available in the controller's method.

2.how show charts image in each cells of schedular month by call this

2) If you want to load an image in each cell of the scheduler, you can hide the cell body, which is generated by default, and resize the cell header (you can define the header through the template). Something like:

HTML

   <style>

    .dhx_month_body

    {

        /*hide default month cell body*/

        display:none;

    }

    .dhx_month_head

    {

        /*expand cell header*/

        width:187px !important;

        height:160px !important;

        border-top: 1px solid #A4BED4;

    }

</style>

<!-- select box for ids -->

<select id='selectBox'>

<option value='1' selected>1</option>

<option value='2'>2</option>

<option value='3'>3</option>

</select>

    <script type="text/javascript">

        //template for month header

        scheduler.templates.month_day = function (date) {

            var fullMonth = (date.getMonth() + 1) < 10 ? ("0" + (date.getMonth() + 1).toString()) : date.getMonth() + 1;

            //collect cell date string as mm.dd.yyyy

            var dateString = [fullMonth, date.getDate(), date.getFullYear()].join(".");

            //get selected id

            var id = document.getElementById("selectBox").value;

            //render cell removed

            var removed = '<div style="text-align:right;">' + date.getDate() + '</div>'; //header with day of month

            //add image, we will pass parameters in query string, parameters are cell date and selected id

            content += '<img src="@Url.Action("Data", "Calendar")?id=' + id + '&date=' + dateString + '" width="160px" height="160px"/>';

            return content;

        };

        //refresh scheduler on id change

        document.getElementById("selectBox").onchange = function () { scheduler.update_view() };

       

        scheduler.init('scheduler_here', new Date(2011, 8, 19), 'month');

    </script>

NOTE: You don't need to call scheduler.load("/Calendar/CallReceiveDate");, since it loads all data with images in the month_day template.