Telerik Forums
Kendo UI for jQuery Forum
2 answers
94 views
Hi,

Is there a way make the Save Changes, Cancel Changes buttons have state so they are only enabled when changes have been made?

Thanks

Chris



Christopher
Top achievements
Rank 1
 answered on 30 Aug 2012
1 answer
136 views
We are seeing a problem where the pagination numbers (page X of Y) and number of rows (1 - A of A items) are being formatted as decimals. See the attached screenshot. This appears to happen only when viewing the application in Internet Explorer.

Does anyone have any advice on what's causing this?
Ed
Top achievements
Rank 1
 answered on 29 Aug 2012
0 answers
26 views
Why PanelBar minimized if I turn on a particular item (link) in it? 
Igor
Top achievements
Rank 1
 asked on 29 Aug 2012
0 answers
56 views
 Sorry wrong
Igor
Top achievements
Rank 1
 asked on 29 Aug 2012
0 answers
89 views
I am using the MVC extensions for the Kendo grid and everytime i insert 1 record it goes through OK but then when i try to insert another record, any jQuery that i have on the page doesn't work. For instance i am using a Google map to populate latitude and longitude fields in the popup editor of the grid. The first time, i use jQuery to populate the textboxes and the it works fine, but when i insert that record and try to insert another record after that, the same jQuery functions do not work anymore. Any ideas?
michal
Top achievements
Rank 1
 asked on 29 Aug 2012
2 answers
684 views
Please help ... 
[1] at the beginning, I create an index.htm file, the template is also defined in the same file.
It works perfectly!!! but the problem is in the second part....

<div id="mydiv">
    <div id="listView" data-role="listview" data-editable="true" data-template="my-template"
         data-bind="source: MySource">
    </div>
</div>
 
<script id="my-template" type="text/x-kendo-template">
    <div>${Status}</div>
    <div>
 
      # if (Status.toUpperCase() == "SINGLE"){#
 
            <img src="imgs/black_acs.png" alt="black_acs image" />
 
      #}else if (Status.toUpperCase() == "MARRIED"){#
 
            <img src="imgs/blue_acs.png" alt="blue_acs image" />
 
       #}else if (Status.toUpperCase() == "OTHER"){#
 
             <img src="imgs/red_acs.png" alt="red_acs image" />
 
       #}#
 
    </div>
</script>
 
<script>
$(document).ready(function ()
            {
        var viewModel = kendo.observable({
           MySource: new kendo.data.DataSource({  // name and status
            transport: {
                      read: {
                        url: "http://xxx.com/REST.VN/AService/GetData",
                        type: "GET",
                        dataType: "json",
                        contentType: "application/json; charset=utf-8",
                        data: function ()
                            {
                                    var jsonParameters = {};
                                jsonParameters.parameter = "XXX";
                                    return jsonParameters;
                            }
                }
             }
        });
 
    kendo.bind($("#mydiv"), viewModel);
});
 
</script>


[2] ... after that, I decide to move the template as external file so that it can be reused by other pages.
I create another file called: template1.tmpl.htm 
This is the content in the file. 
<script id="my-template" type="text/x-kendo-template">
    <div>${Status}</div>
    <div>
 
      # if (Status.toUpperCase() == "SINGLE"){#
 
            <img src="imgs/black_acs.png" alt="black_acs image" />
 
      #}else if (Status.toUpperCase() == "MARRIED"){#
 
            <img src="imgs/blue_acs.png" alt="blue_acs image" />
 
       #}else if (Status.toUpperCase() == "OTHER"){#
 
             <img src="imgs/red_acs.png" alt="red_acs image" />
 
       #}#
 
    </div>
</script>


In the index.html, I create a template loader function as suggested in http://docs.kendoui.com/howto/load-templates-external-files 
on the top of the page: <script src="templateLoader.js"></script>

At the script section, I modify:
<script>
 
$(document).bind("TEMPLATE_LOADED", function (e, data) {
                _itemTemplate = kendo.template($("#my-template").html(), { useWithBlock: false });
                _itemTemplate(data);
                bindMe();
            });
 
$(document).ready(function ()
           {
        templateLoader.loadExtTemplate("template1.tmpl.htm");
            });
 
function bindMe()
{
     var viewModel = kendo.observable({
           MySource: new kendo.data.DataSource({  // name and status
            transport: {
            read: {
            url: "http://xxx.com/REST.VN/AService/GetData",
            type: "GET",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            data: function ()
                {
                    var jsonParameters = {};
                    jsonParameters.parameter = "XXX";
                return jsonParameters;
                }
            }
         }
    });
 
    kendo.bind($("#mydiv"), viewModel);
}
 
</script>




The result is not showing at all.....
I thought it is not loading the template, so I start debugging. The template is loaded.
(I won't think it is a data issue because it works fine when the template is on the same file.)


Then .... I think something might not correct in the template definition... (it should work fine since it works when template is on the same file)

I removed every thing from the template file:

<script id="my-template" type="text/x-kendo-template">
    <div>fixed text</div>
</script>


This time ... it works with fixed text .... !?!? it becomes interesting....

Then, I start adding data to the template
<script id="my-template" type="text/x-kendo-template"> 
<div>${Status}</div> 
</script> 

Guess what !? ... it is not working ...
After trying ....
<script id="my-template" type="text/x-kendo-template"> 
<div>${data.Status}</div> 
</script> 
It works.... I am able to get the list of Status.

Why do we have to use "data." in the template (external template file)? Previously, the template is defined in the same file, I don't have to put .data in front of field name.
 
Now... conditioning ..
If I remove .toUpperCase(), it works. but I NEED to use the function (and other functions) in the if-else statements.
Since the data can be SiNgle, sinGLE etc.
Why it is not working when I exclude the template from the original file? 
<div>
                  # if (
data.Status.toUpperCase() == "SINGLE"){#
                        <img src="imgs/black_acs.png" alt="black_acs image" />
                  #}else if (
data.Status.toUpperCase() == "MARRIED"){#
                        <img src="imgs/blue_acs.png" alt="blue_acs image" />
                  #}else if (
data.Status.toUpperCase() == "OTHER"){#
                         <img src="imgs/red_acs.png" alt="red_acs image" />
                  #}#
        </div>
 


Please help ....
Jan
Top achievements
Rank 1
 answered on 29 Aug 2012
1 answer
176 views
I know you can set server sider filtering to true or false during configuration but I would like to change this at runtime.

The reason being, if my data set is small enough i want to be able to do filtering client side (as an optimization). If its too large I would like to set it to server side filtering.

Is it possible to change this flag at runtime?
Adrian
Top achievements
Rank 1
 answered on 29 Aug 2012
1 answer
294 views
I am trying to use MVC's model binding functionality. I have  a source that I need to submit to the server and then have it return a value called a Yield to Maturity. The issue is my form is bound to a viewModel. When I do a yieldSource.sync() , the form is submitted with my schema model but nothing is populated. 

Here is my code: Originally I was doing gets in the addYieldValues method but that didn't seem to do anything unless I put the values in an array.

Please help.

$(document).ready(function () {
        
           var viewModel = kendo.observable({
            
           order : {
                   allocations: [],
                   yieldCalcs: [],  
                   TradeDate: "",
                   SettleDate: "",
                   EventType:"",
                   TrustCode: "",
                   Broker: "",  
                   BondProceeds: function(){                                       
                               return this.get("UnderlyingPar") * (this.get("UnderlyingPrice")/100) + this.get("UpfrontFees");
                                       },
                   UnderlyingPar: "",
                   TrustFee: "",
                   RemarkFee: ".",
                   WrapFee: "",
                   LiquidFee: "",
                   BMASIFMA: "",
                   UnderlyingPrice: "",
                   UpfrontFees: "",
                   FloaterAmount:"",
                   InverseFloatPar:"",
                   LeverageRatio: function(){
                       return this.get("FloaterAmount")/this.get("InverseFloatPar");
                   },
                   ResidualYield: function(){
                    
                   },
                   ResidualAmount: "",
                   ResidualPrice: function(){
                       return this.TotalAmount()/this.get("InverseFloatPar")*100;
                   },
                   InterestOnFloat: function(){    
                       return this.get("FloaterAmount")*this.get("BMASIFMA");
                   },
                   InterestOnAssets: function(){
                       return this.get("UnderlyingPar") * this.get("UnderlyingCoupon");
                   },
                   ProgramFees: function(){
                       return (this.get("UnderlyingPar") * (this.get("TrustFee") + this.get("WrapFee"))) + (this.get("FloaterAmount") * (this.get("RemarkFee") +
                       this.get("LiquidFee")));
                   },
                   UnderlyingYield: ".0375",
                   UnderlyingCoupon: ".05",
                   TerminationDate:"",
                   EffectiveCoupon: function(){
                       return  (this.InterestOnAssets() - this.InterestOnFloat() - this.ProgramFees())/this.get("InverseFloatPar");
                   },
 
                   TotalAmount: function(){
                                      return this.get("UnderlyingPar") * (this.get("UnderlyingPrice")/100) - this.get("FloaterAmount");
                                       },
                   ResAccInt: function(){
                   }
            },
            yieldSource: new kendo.data.DataSource({
                      pageSize: 1,
                      data: this.order,                
                      transport: {
                                  read: {                                       
                                      url: "@Url.Action("GetYield","Home")",
                                      dataType: "json"
                                   },
                                  create : {
                                  url: "@Url.Action("GetYield","Home")",
                                      dataType: "json"
                                  }
                      },
                      schema: {                        
                           model: {
                               fields: {
                                   SettleDate:  { Type: "Date", validation: {required: true }},
                                   TerminationDate:  {Type: "Date",  validation: {required: true }},
                                   EffectiveCoupon: { Type: "Number", validation: {required: true }},
                                   ResidualPrice:  { Type: "Number",validation: {required: true }},
                                   EffectiveCoupon: {Type: "Number",validation: {required: true}},
                                   ResidualYield: {Type: "Number",validation: {required: true}},
                                   ResidualPrice: {Type: "Number",validation: {required: true}},
                                   InverseFloatPar: {Type: "Number",validation: {required: true}},
                                   LeverageRatio: {Type: "Number",validation: {required: true}},
                                   UnderlyingPar: {Type: "Number",validation: {required: true}},
                                   UnderlyingPrice: {Type: "Number",validation: {required: true}},
                                   UnderlyingYield: {Type: "Number",validation: {required: true}},
                                   UnderlyingCoupon: {Type: "Number",validation: {required: true}},
                                   EventType: {Type: "Number",validation : {required: true}},
                                   TrustCode: {Type: "Number",validation : {required: true}},
                                   Broker: {Type: "Number",validation : {required: true}},
                                   BondProceeds: {Type: "Number",validation : {required: true}},
                                   BMASIFMA: {Type: "Number",validation : {required: true}},
                                   WrapFee: {Type: "Number",validation : {required: true}},
                                   RemarkFee: {validation : {required: true}},
                                   LiquidFee: {validation : {required: true}},
                                   ResccInt: {validation : {required: true}},
                                   TotalAmount: "TotalAmount"
                                   }
                               }
                           },
                       parameterMap: function(options, operation){
                           if(operation=="create"){
                               console.log(options);
                                 
                                   return { models: kendo.stringify(options.models)};
                           }  
                           return options;                        
                       }
                        
            }),
            addYieldValues: function(){
                 
                    
                   this.yieldSource.add(this.viewModel);
                   this.yieldSource.sync();
                    
               },
Daniel
Telerik team
 answered on 29 Aug 2012
2 answers
124 views
I'm having this problem with Kendo window, I can get the content to show up fine but when I use the call back function to retrieve and populate a div tag in the window, Kendo automatically applies a style of "display:none" to it. Is there a work around for this at all to use a custom message box with kendow window?
Kai
Top achievements
Rank 1
 answered on 29 Aug 2012
4 answers
186 views
Hi,

Just wondering if it's only happening to me, I'm using the gauge for a couple of time and everything went well util I upgrade my kendo version to 2012.2.727 yesterday

Not I got two javascript errors:

Error: Invalid value for <circle> attribute cx="undefined" :81/Desktop/Administration/Dashboard/Widget/Widget.aspx#:1
Error: Invalid value for <circle> attribute cy="undefined"

And I'm able to see a little 'something' on the top left of my gauge (See attachement)
Of course if I look at the generated svg I'm able to see the thing on the top left.

<circle cx="undefined" cy="undefined" r="5.4797" fill-opacity="1" stroke-opacity="1" fill="#ea7001"></circle>

So first is it me only ? Or is it something global ? If yes is there any quick fix ? 
I know its not a blocking thing, but it would be great if I can solve this asap.

Thanks,

Damien

 
Hristo Germanov
Telerik team
 answered on 29 Aug 2012
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
MultiColumnComboBox
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
TimePicker
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?