please me issue have.
embedded in crm on demand have view needs take values crm input fields perform search against crm through web service , show view if duplicate records found.
here have code libraries against crm {crm.context.ts}:
/* * context helpers */ declare var epmcrm: any; class context { private getparameterbyname(name) { name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new regexp("[\\?&]" + name + "=([^&#]*)"), results = regex.exec(location.search); return results == null ? "" : decodeuricomponent(results[1].replace(/\+/g, " ")); } config: { objects: { [key: string]: } } = { objects: { "homepage": { name: "homepage" }, "task": { name: "task", idparam: "taskdetailform.id", screens: { "/ondemand/user/taskdetail": "detail", "/ondemand/user/taskedit": "edit" } }, "account": { name: "account", idparam: "accountdetailform.id", screens: { "/ondemand/user/taskdetail": "detail", "/ondemand/user/taskedit": "edit" } }, "user": { name: "user", idparam: "userdetailform.id", screens: { "/ondemand/user/userdetail": "detail", "/ondemand/user/useredit": "edit" } }, "opportunity": { name: "opportunity", idparam: "opportunitydetailform.id", screens: { "/ondemand/user/opportunitydetail": "detail", "/ondemand/user/opportunityedit": "edit" } }, "contact": { name: "contact", idparam: "contactdetailform.id", screens: { "/ondemand/user/contactdetail": "detail", "/ondemand/user/contactedit": "edit", // "/ondemand/user/contactinsert": "create" } } } }; private knownpaths: { [key: string]: } = { "/ondemand/user/homepage": this.config.objects["homepage"], "/ondemand/user/taskdetail": this.config.objects["task"], "/ondemand/user/taskedit": this.config.objects["task"], "/ondemand/user/accountdetail": this.config.objects["account"], "/ondemand/user/accountedit": this.config.objects["account"], "/ondemand/user/contactdetail": this.config.objects["contact"], "/ondemand/user/contactedit": this.config.objects["contact"], // "/ondemand/user/contactinsert": this.config.objects["contact"], "/ondemand/user/userdetail": this.config.objects["user"], "/ondemand/user/useredit": this.config.objects["user"], "/ondemand/user/opportunityedit": this.config.objects["opportunity"] //"/ondemand/user/customobj2": mapping custom objects here important! }; webserviceurl: string = null; screen: string = null; objecttype: string = null; objectid: string = null; ssotoken: string = null; moduleroot: string = null; rowid: string = null; commentsaction: string = null; status: string = null; //crm parameters built task link; account: string = null; accountid: string = null; contact: string = null; contactid: string = null; quote: string = null; quoteid: string = null; order: string = null; orderid: string = null; oppty: string = null; opptyid: string = null; lead: string = null; leadid: string = null; step: string = null; //crm contact lastname: string = null; firstname: string = null; email: string = null; constructor() { // pick out info url this.webserviceurl = "https://" + window.location.hostname + "/services/integration"; // sso token global variable defined in web applet this.ssotoken = epmcrm.ssotoken; // module root global variable defined in web applet this.moduleroot = epmcrm.moduleroot; this.rowid = epmcrm.rowid; this.commentsaction = epmcrm.commentsaction; this.status = epmcrm.status; this.step = epmcrm.step; //crm parameters built task link; this.account = epmcrm.account; this.accountid = epmcrm.accountid; this.contact = epmcrm.contact; this.contactid = epmcrm.contactid; this.quote = epmcrm.quote; this.quoteid = epmcrm.quoteid; this.order = epmcrm.order; this.orderid = epmcrm.orderid; this.oppty = epmcrm.oppty; this.opptyid = epmcrm.opptyid; this.lead = epmcrm.lead; this.leadid = epmcrm.leadid; //crm contact $("#contacteditform\\.first\\ name").on("change", function () { this.firstname = (<htmlinputelement>document.getelementbyid("contacteditform.first name")).value; }); $("#contacteditform\\.email\\ address").on("change", function () { this.email = (<htmlinputelement>document.getelementbyid("contacteditform.email address")).value; }); $("#contacteditform\\.last\\ name").on("change", function () { this.lastname = (<htmlinputelement>document.getelementbyid("contacteditform.last name")).value; }); // attempt discover contextual information var pathname = window.location.pathname; if (this.knownpaths[pathname]) { var obj = this.knownpaths[pathname]; this.objecttype = obj.name; if (obj.idparam) { this.objectid = this.getparameterbyname(obj.idparam); } if (obj.screens) { this.screen = obj.screens[pathname]; } } } } export = context; in view models have should give me results knockout observables should mirror crm field , results perform search , return or not results: `contactsearch.ts` import ko = require("knockout"); import context = require("libs/crm.context"); import contacts = require("libs/crm.contacts"); $("#btn_tb_contactnewform_save").hide(); $("#btn_tb_contactnewform_save_idx_1").hide(); //$("#contacteditform\\.first\\ name").on("change", assignfname); //$("#contacteditform\\.last\\ name").on("change", assignlname); //function assignfname() { // var firstname = (<htmlinputelement>document.getelementbyid("contacteditform.first name")).value; // alert(firstname); //} //function assignlname() { // var lastname = (<htmlinputelement>document.getelementbyid("contacteditform.last name")).value; // alert(lastname); //} //function assignemail() { // var email = (<htmlinputelement>document.getelementbyid("contacteditform.email address")).value // alert(email); //} //var contactviewmodel = function () { // var self = this; // self.validcontacts = ko.observablearray([]); // self.addcontact = function (validcontact) { // self.validcontacts.puch(validcontact); // $.ajax({ // data: ko.tojson(this), // contenttype: 'application/json', // success: function (result) { // validcontact.fname(result. // } // }); // } //} class contactsearch { private _context: context = new context(); private _contacts: contacts = new contacts(this._context.webserviceurl); private _firstname = this._context.firstname; private _lastname = this._context.lastname; private _email = this._context.email; vfname = ko.observable(this._firstname); vlname = ko.observable(this._lastname); vemail = ko.observable(this._email); //email = ko.computed({ // read: () => $("#contacteditform\\.email\\ address").on("change", function () { // }) //}) ////}) //lname = ko.observable(""); ////email = ko.computed(function () { //// assignemail(); //}) issearching: knockoutobservable<boolean> = ko.observable(false); searchvalue = ko.computed({ read: () => ("[contactemail]~=" + "'" + "" + "'" + " , [contactfirstname]~=" + "'" + this.vfname() + "'" + " , [contactlastname]~=" + "'" + this.vlname() + "'") }); contactsearchresults: knockoutobservablearray<icontact> = ko.observablearray([]); dovalidation() { $("#contacteditform\\.email\\ address").on("change", function () { }) } docontactsearch() { this.issearching(true); this.contactsearchresults([]); this._contacts .find(this.searchvalue(), ["id", "contactfirstname", "contactlastname", "contactemail", "accountid", "accountname"]) .done((results: icontact[]) => { if (results.length > 0) { this.contactsearchresults(results); this.issearching(false); } else { $("#btn_tb_contactnewform_save").show(); $("#btn_tb_contactnewform_save_idx_1").show(); alert("# of matching results= " + results.length); } }); } bindtr(element): void { /* * replicate crmod method of hover styles */ var $element = $(element); $element.hover( () => { $element.attr("_savedbgcolor", $element.css("background-color")); $element.css("background-color", "#d3dde6"); }, () => { $element.css("background-color", $element.attr("_savedbgcolor")); $element.attr("_savedbgcolor", ""); } ); } bindlink(element): void { var $element = $(element); $element.click( () => { window["donavigate"]('contactdetail?octitle=' + encodeuricomponent(this.vlname()) + '&contactdetailform.id=' + this.contactsearchresults["id"] + '&octype=', true, this, null) }, () => { $element.css("text-decoration", "underline"); } ); } } export = contactsearch; david,
i have created observables , i'm binding here in html view model, source data htmlinputelement , don't know how pass values observables.
<p>email <input data-bind="value: vemail" /> <span data-bind="text: vemail"></span> <span data-bind="text: vfname"></span> <span data-bind="text: vlname"></span> <p>enter search spec: <textarea data-bind="value: searchvalue" /> <button type="button" data-bind="click: validation, click: docontactsearch">go</button></p> <table class="list clist" cellspacing="0"> <thead> <tr> <th class="m"> <th class="m"> <th>id</th> <th>first name</th> <th>last name</th> <th>email</th> <th>account id</th> <th>account</th> </tr> </thead> <tbody data-bind="visible: issearching"> <tr> <td colspan="99" style="text-align:center;">searching, please wait...</td> </tr> </tbody> <tbody data-bind="foreach: contactsearchresults, afterrender: bindtr, click: bindlink"> <tr> <td class="lrml"> </td> <td> </td> <td data-bind="text: id"></td> <td data-bind="text: contactfirstname"></td> <td data-bind="text: contactlastname"></td> <td data-bind="text: contactemail"></td> <td data-bind="text: accountid"></td> <td data-bind="text: accountname"></td> </tr> </tbody> </table> i have file create dependency crm:
var epmcrm; ((epmcrm) => { if (!epmcrm["moduleroot"]) throw new error("epmcrm global variable not configured"); require.config({ baseurl: epmcrm.moduleroot + "/scripts/app", paths: { // define libs here // 1. external "jquery": "//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min", "jquery-ui.theme": "//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.theme.css",// added "knockout": "//cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min", "text": "//cdnjs.cloudflare.com/ajax/libs/require-text/2.0.10/text", "json2": "//cdnjs.cloudflare.com/ajax/libs/json2/20130526/json2.min", "knockout.mapping": "//cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping", // added daniel // 2. internal "koextensions": "../libs/knockout-extensions", "libs/crm.tasks": "../libs/crm.tasks", "libs/crm.accounts": "../libs/crm.accounts", "libs/crm.contacts": "../libs/crm.contacts", "libs/crm.users": "../libs/crm.users", "libs/crm.session": "../libs/crm.session", "libs/crm.context": "../libs/crm.context", "libs/crm.objects": "../libs/crm.objects", "libs/crm.utilities": "../libs/crm.utilities", "libs/crm.viewengine": "../libs/crm.viewengine", "libs/crm.viewmodelengine": "../libs/crm.viewmodelengine" }, shim: { "knockout": { deps: ["json2"] } } }); require(["knockout", "knockout.mapping", "koextensions"], (ko: knockoutstatic, komap: knockoutmapping) => { ko.mapping = komap; ko.applybindings({}, document.getelementbyid("quotewebappletcontainer")); }); })(epmcrm || (epmcrm = {}));
i'm coming solution eventually, because got need.
this changed this:
$("#contacteditform\\.first\\ name").on("change", () => { this.firstname((<htmlinputelement>document.getelementbyid("contacteditform.first name")).value); }); $("#contacteditform\\.email\\ address").on("change", () => { this.email((<htmlinputelement>document.getelementbyid("contacteditform.email address")).value); }); $("#contacteditform\\.last\\ name").on("change", () => { this.lastname((<htmlinputelement>document.getelementbyid("contacteditform.last name")).value); }); this 3 variables changed observable properties:
lastname: knockoutobservable<string> = ko.observable(""); firstname: knockoutobservable<string> = ko.observable(""); email: knockoutobservable<string> = ko.observable(""); and here i've made other changes:
vfname = this._context.firstname; vlname = this._context.lastname; vemail = this._context.email; issearching: knockoutobservable<boolean> = ko.observable(false); searchvalue = ko.computed(() => { return ("[contactemail]~=" + "'" + ko.unwrap(this._context.email) + "'" + " , [contactfirstname]~=" + "'" + ko.unwrap(this._context.firstname) + "'" + " , [contactlastname]~=" + "'" + ko.unwrap(this._context.lastname) + "'") });
Comments
Post a Comment