Telerik Forums
Kendo UI for jQuery Forum
0 answers
86 views
Hi,

I'm using dropdownlist and autocomplete to search data from backend.when  I am filtering data in autocomplete the data is working as i seen in img1 image which I have attached.But the problem is if I try to get the data related to the dropdown list selected item the autocomplete is not working. I need the results as attached example images img2 and img3. If I select the data as DataItem1 then data related to that data only should be displayed.

I have worked out on this using filters but in autocomplete if I use more than one filter then autocomplete is not firing.

Any help is appreciated.

Regards,
srinu

SriNi
Top achievements
Rank 1
 asked on 25 Oct 2012
0 answers
156 views
Hi,

Is there a simple method to include a separator or sub-titles in the the list of items displayed in a combobox?

I use a template to render the item contents, and can change the text if the item from the server data is a separator, but it is still selectable. I suppose I am looking for a class or something that I can put on the item to make the item un-selectable.

My combobox has number of preferred values at the top of the list, but offers the user additional options that may be relevant in rare cases. I would like to visually separate the preferred options from the rarely used options.

Sample:
template: '# if (data.Divider != true) { #<span>${ data.RowLabel }</span> # } else { #  <div class="nonselectable">${ data.RowLabel}</div> # } # '
BobDev
Top achievements
Rank 1
 asked on 25 Oct 2012
0 answers
345 views
Hi,

i am facing some stupid problem. i have try lots other way but i am not getting success.

i am using kendomobilelistview with template binding with $.ajax every thing working fine but button click event fire on time then if refresh data(using endlessScroll) then button event fire twice and again refresh listview then click on button then fire three time event. if we do same process again then again fire 4 event. 

if refresh list view then continue increase  event again and again.

dataSource with service 
var JobActionItemDataSource = new kendo.data.DataSource({
    pageSize: 15,
    serverPaging: true,
    transport: {
        read: function (options) {
            window.kendoMobileApplication.showLoading();
            $.ajax({
                url: urlstring + "GetJobTaskByEmployeeID",
                data: {
                    UserID: JSON.stringify(localStorage.getItem("AuthorizedUserId")),
                    CompanyType: JSON.stringify($('#radio_Marketing').attr('checked') ? 1 : 0),
                    PageSize: options.data.pageSize,
                    PageNumber: JobActionItemPageIndex
                },
                dataType: "jsonp",
                success: function (result) {
                    options.success(result.d);
                    JobActionItemPageIndex += 1;
                }
            });
        },
 
        data: function (response) {
            alert(response.d);
            return response.d;
        }
    }
});

init function 
// view design here
  <div data-role="view" data-title="Action items" id="view-actionitems" data-init="init_ActionItemsLanding"
        data-show="show_ActionItemsLanding">
        <header data-role="header">
        <div>
          <img  src="img/CompanyLogo.png" width="100px" height="34px" />
           <a class="km-rightitem" data-rel="popover" href="#popover-actionitems" data-role="button">Jump To</a>
          <a class="km-rightitem" data-click="Logout" data-role="button">Logout</a>
        </div>
        
      </header>
        <ul id="endlessscrolling-JobActionItemsBinding">
        </ul>
</div>
/// script code
 <script id="endlessscrolling-JobActionItemsBinding-template" type="text/x-kendo-template">
       <div class="tweet">
            <div class="notesmessage">
              <span >
              #if(JobID!=0){#
              <div> <a  id="WorkFlowTaskId=#=WorkFlowTaskId#&RequiredCompletionActionID=#=RequiredCompletionActionID#&JobID=#=JobID#&TaskID=#=TaskID#" data-role="button" class="km-button" data-click="GoActionitemcompleteevent"
                style="width:auto; background: none repeat scroll 0 0 transparent;box-shadow: none;color: blue;margin-left: 0;text-decoration:underline;padding: 5px;width: auto;text-align: left;" >#= Task #</a></div>
              <br/>
              #=DueTimeFrameColorFormat#
              #} else{#
                #= Task # <br/>
              #}#
              #= DueTimeFrame # </span>
                <div style="text-align: center;">
                #if(JobID!=0){#
               <a  id="#=JobID#" data-role="button" data-click="job_jobdetails" style="width:145px;padding: 5px;" >#= JobNumber # </a>
               <a  name="0" id="WorkFlowTaskId=#=WorkFlowTaskId#&RequiredCompletionActionID=#=RequiredCompletionActionID#&JobID=#=JobID#&TaskID=#=TaskID#" data-role="button" data-click="GoActionitemcompleteevent" style="width:70px;padding: 5px;" >Complete</a>
              <br/> #}#
                
               <a id="#=CustomerID#&Type=#=CustomerType#" data-role="button" data-click="GotoViewContactInformation" style="width:145px;padding: 5px;" ><span style="font-size: 0.8em; font-style:italic;">#= EmployeeName #</span></a>
               #if(JobID!=0){#
 
               <a  id="ID=#=JobID#&JobNumber=#=JobNumber#" data-role="button"   data-click="GoToViewJobAddActionItems" style="width:70px;padding: 5px;" >Add</a>
                #}else{#
                <a  id="ID=#=CustomerID#&Type=#=CustomerType#&ContactName=#=EmployeeName#" data-role="button"   data-click="GoToViewAddMarketingActionItem" style="width:70px;padding: 5px;" >Add</a>
                #}#
               </div>
            </div>
      </div>
    </script>
 
 
// init function
function init_ActionItemsLanding(e) {
    $("#endlessscrolling-JobActionItemsBinding").kendoMobileListView({
        dataSource: JobActionItemDataSource,
        template: kendo.template($("#endlessscrolling-JobActionItemsBinding-template").text()),
        endlessScroll: true,
        scrollTreshold: 30
    });
}
 
// show funciton
   JobActionItemPageIndex = 1;
    var refreshJobActionItems = $("#endlessscrolling-JobActionItemsBinding").data("kendoMobileListView");
    refreshJobActionItems.dataSource.read(1);
    refreshJobActionItems.refresh();

thanks,

Raghw
 

 
Nick
Top achievements
Rank 1
 asked on 25 Oct 2012
3 answers
342 views
I would like for my autocomplete box to populate on focus and then filter down as the user types, essentially giving it a minlength of zero.  Just setting the minlength to 0 doesn't seem to do it.  I also tried using a combobox instead but it only makes a single web service call and then filters down the data from the call (instead of retrieving fresh data). 

The reason that doesn't work for me is the resulting data can be anywhere from 0 to thousands, and my web service only returns the top 20 results, so I need to refreshing the datasource as the user types.  The autocomplete does this perfectly, but like I said I just can't get it to populate without any user input. 

What do you recommend?
ping0
Top achievements
Rank 1
 answered on 25 Oct 2012
3 answers
53 views
JustCode is reporting an error on kendo.mobile.all.min.css
 and the source is "// Strange this one is..." on line 9 Col 111356

There are a total of 142 error in kendo.mobile.all.min.css

Maybe somebody should dogfood the all the css files

Pat NH USA



Kamen Bundev
Telerik team
 answered on 25 Oct 2012
4 answers
180 views
In the current screen where I am working with the Kendo Grid, I send a JSON object that will be validated by the webservice before it sends results back. 

When I send data however that causes a business validation error (incorrect combination), the webserver returns a 400 Error, and the error message which I handle in the error handler (
error: function(e){
//JqueryPopup showing message
 }


After however, my grid is completely unresponsive.  I can no longer sort, refresh the datasource, or any other activity.  Even when I take out all error handling, the behaviour is the same.

Is there something wrong with my implementation?

I have found a work around - The Datasource has flagged it a Request in progress (datasource._requestInProgress = true)

It works after I reset this flag to false, but i'm not sure why this is occurring in the first place.

thanks!

Nikolay Rusev
Telerik team
 answered on 25 Oct 2012
0 answers
100 views
Is there any way to do paging in Kendo Grid without resorting to OData?

I just want the skip and take parameters passed into my controller. That's all I need. OData breaks a whole bunch of encapsulation for us and is just such a tremendous burden to implement without breaking existing architecture.

So please is there a way, to get to OData for paging without resorting to Web API or WCF Data services.

Thank you
Alwyn
Top achievements
Rank 1
 asked on 25 Oct 2012
1 answer
151 views
I have a grid with a pop-up editor that contains a date picker control and numeric text-box. On page load I change the kendo culture 

kendo.culture("de-DE");


All data shows up correctly on the grid. Now when I click on "Edit", the popup shows up with the right date. But the value in the numeric text-box is not correctly displayed. It shows a "." instead of ",".  (grid1.png)
 
And also when I change the values form 3.7 to 3.8; the numeric text box shows it as 38 instead of 3.8 (grid2.png)

Any ideas how this should be tackled?
Thanks.
Just
Top achievements
Rank 1
 answered on 24 Oct 2012
1 answer
137 views
I have a KendoUI Grid that has a detail template defined.  Is it possible to change the template on the fly?

I tried setting options.detailTemplate with a new template and also called refresh() but that didn't work.

Thanks,

victor
CsHARPMan
Top achievements
Rank 1
 answered on 24 Oct 2012
1 answer
251 views
I have a view with an input field that displays firstName.  I want to apply some business logic to firstName.  If the user violates the business logic, I want the view to display the "current" value for firstName.
.
Here is the view:
<div id="personFields">
    <div class="field">
        <div>First Name:</div><input data-bind="value: firstName" required />
    </div>
    <div class="field">
        <div>Last Name:</div><input data-bind="value: lastName"/>
    </div>
    <div class="field">
        <div>Full Name:</div><span data-bind="text: fullName"/>
    </div>
     
    <button data-bind="click: reset">Reset</button>
</div>

Here is the ViewModel:
var person = kendo.observable({
    firstName: "John",
    lastName: "DeVight",
    fullName: function() {
        return this.get("firstName") + " " + this.get("lastName");
    },
     
    reset: function() {
        this.set("firstName", "John");
        this.set("lastName", "DeVight");
    }
}).bind("set", function(e) {
    if (e.field == "firstName" && !e.value) {
        e.preventDefault();
    }
});
 
kendo.bind($('#personFields'), person);

When I change firstName to an empty value, the input field remains empty.

I tried changing the handler for the set event to this:
function(e) {
    if (e.field == "firstName" && !e.value) {
        var field = e.field;
        var currVal = this.get(e.field);
           this.set(field, currVal);
        e.preventDefault();
    }
}

But the input field still does not get reset to the "current" value.  How do I do this?

Regards,

John DeVight
John DeVight
Top achievements
Rank 1
 answered on 24 Oct 2012
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
Date/Time Pickers
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)
SPA
Filter
Drawing API
Drawer (Mobile)
Globalization
Gauges
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
OrgChart
TextBox
Effects
Accessibility
ScrollView
PivotGridV2
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
Popover
DockManager
FloatingActionButton
TaskBoard
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
+? more
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?