Bind data in tab activate event not working

3 posts, 0 answers
  1. Claudia
    Claudia avatar
    33 posts
    Member since:
    Jun 2017

    Posted 20 Apr 2018 Link to this post

    Hi

    I'm having trouble binding the data when I change the tab. First time the data s binding perfectly fine but when I click any other tab is not working and if I return to the first one the data is there. here is part of my code I will appreciate any help

     

    function createTabStrip() {
    $("#tabstrip").kendoTabStrip({
    tabPosition: "top",
    scrollable: true,
    dataTextField: "ItemId",
    dataContentUrlField: "ItemUrl",
    dataSource: dataSourceItem,
    dataBound: function () {
    var tabStrip = $("#tabstrip").data("kendoTabStrip");
    tabStrip.select(0);
    },
    activate: onItemSelect,
    });
    }

     

    function onItemSelect()
    {
    var index = this.select().index();
    currItem = dataSourceItem.view()[index].ItemId;
    if (itemDatSourceCreated === false) {
    createItemObsDataSource();
    createItemDataObservable();
    itemDatSourceCreated = true;
            Observ.dataSource.read();
    }
    else
    itemObserv.dataSource.read();
    }

     

    function createItemDataObservable() {
    itemObserv = kendo.observable({
    dataSource: dataSourceItemDat
    });
    }

     

    function createItemObsDataSource() {
    dataSourceItemDat = new kendo.data.DataSource({
    transport: {
    read: {
    url: baseUrl + "/api/EPDApi/GetInfo/",
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    type: "POST",
    },
    parameterMap: function (data, type) {
    var result = {
    Id: currId,
    source: currSource,
    contract: currItem
    }
    return kendo.stringify(result);
    }
    },
    batch: true,
    pageSize: 20,
    schema: {
    model: {
    id: "contID",
    fields: {
    contID: { from: "ContractId" },
    contDirInc: { from: "DirectoryInclude" },
    contIpa: { from: "IPAAffiliate" },
    contIpaName: { from: "IPAAffiliateName" },
    contPart: { from: "Participation" },
    contPcp: { from: "PCP" },
    contSpecialty: { from: "Specialty" },
    contPrimSpec: { from: "PrimarySpecialty" },
    contSubSpec: { from: "SubSpecialty" },
    contSpecType: { from: "SpecialtyType" },
    contProvTier: { from: "ProvTier" },
    contProvTierPlan: { from: "ProvTierPlanCode" }
    }
    }
    },
    change: function () {
    kendo.unbind($("#contract"));
    kendo.bind($("#contract"), itemObserv.dataSource.data()[0]);
    }
    })
    }

  2. Claudia
    Claudia avatar
    33 posts
    Member since:
    Jun 2017

    Posted 20 Apr 2018 in reply to Claudia Link to this post

    I found a solution using templates but still I would like to know the solution in this case.

    Thank you

  3. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    1201 posts

    Posted 24 Apr 2018 Link to this post

    Hi Claudia,

    Here you will find a small Dojo sample, following the snippets from your initial post. May I ask you to modify this sample accordingly, so it replicates the required scenario and send it back to us? Moreover, could you please explain a bit in detail what exactly do you need to achieve?

    Regards,
    Veselin Tsvetanov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top