How are we doing? Please help us improve Stack Overflow. Take our short survey

Questions tagged [knockout.js]

Knockout.js is an open source JavaScript library for dynamic HTML UIs using the Model-View-View Model (MVVM) pattern.

Filter by
Sorted by
Tagged with
0
votes
0answers
37 views

Computed returning value for the different viewmodel in knockout js

Here is my viemodel, simple as hell: function collection_rate_vm() { self = this; self.rate = ko.observable(0); self.rate_as_percent = ko.computed(() => { return (self.rate() * 100)....
0
votes
0answers
14 views

How to force datepicker UI to have non-transparent background

I have this overlapping with datepicker-ui and some search bar behind it. I would like to set white, non-transparent background to my dropdown dates sectrion, as well as the whole datepicker-ui ...
0
votes
0answers
15 views

getting total size of ArrayDataProvider

I am using a knockout computed function to update a list with a filter based on inputs from user. This list has some predefined data, and when the filter is applied, I want to know the size of the ...
0
votes
0answers
15 views

Why is my Knockoutjs Computed Observable Not Working when my Observable Array is being Sorted?

Background Info I have an Observable array with three item details in it. Each item detail has the following properties; Item, Group, TotalQTY and InputQty. When the user enters the Input Quantity and ...
0
votes
1answer
20 views

Magento accessing jsLayout config data from a mixin

I want to extend the functionality of a knockout component. I have added the config to the xml file in question: <arguments> <argument name="jsLayout" xsi:type="array"&...
0
votes
0answers
17 views

How to show specific product additonal options in minicart magento2

I have custom product additional options in quote. By default all the options are visible in the mini cart but I want to display only specific ones.enter image description here <div data-role="...
-1
votes
1answer
38 views

Filtering with nested arrays

I will give an example below that I am writing using knockout, but the logic works using standard js. <!-- ko foreach: { data: ourWorks, as: 'item' } --> <div data-bind="visible: $...
0
votes
0answers
18 views

Knockout fn. function to detect collection has settled

Hello and thanks in advance. I have an observable array in which (after ajax request) I push a large number of class objects, many of which has computed variables etc., resulting in a delay. Is it ...
0
votes
1answer
14 views

How to bind focusOut event to knockoutjs

I'm trying to bind focusout event to my knockout js. here is the example: <div class="form"> <label> Country: </label> <input type="text" ...
0
votes
0answers
22 views

Html and momentjs design problem - add spacing to elements with inline css

I have following code: <div> <input type="text" id="start" name="start" data-bind="datepicker: DateTimeFilterFrom,event: { change: applyChangeDate } &...
1
vote
0answers
65 views

Using blazor components outside of blazor app (eg. knockoutjs)

I am working on a migration project. I am the only JS Developer on the team, and rest everyone are C# developers. We are looking to migrate our existing application written in .Net MVC Knockoutjs. ...
1
vote
2answers
31 views

knockout JS $parent object change its information inside for-each loop

I have a knockout js code in magento2 order summery detail page. here is the code <p data-bind="text:console.log('parent befor', $parent)"></p> <!--ko foreach: { data: ...
0
votes
0answers
22 views

Knockout JS Validation of 2 Form Fields that are dependant on each other

var MyObjectModel = function(myObject){ var self = this; self.string1 = ko.observable(myObject.string1); self.string2 = ko.observable(myObject.string2); } I am very new to Knockout and am trying to ...
0
votes
0answers
17 views

How to add pagination to a table with dynamic data source?

I want to dynamically fetch data, when the particular page is clicked in the pagination bar at the bottom. How to add pagination to a table with dynamic data source? The pagination works with ...
0
votes
1answer
14 views

How to bootstrap dropdown button with click function in knockout

i have a button dropdown with options and it works as i want, but i need to remove te input circle image in options, is it possible? or any other idea? thanks! <div class="dropdown"&...
0
votes
1answer
88 views

Edit customer shipping address on checkout - magento 2

Wanted to know how to add edit field for the original shipping address which is provided under customer account and also edit the address properly. Have been checking the magento functionality and ...
0
votes
1answer
40 views

Refresh UI when object key value change - Knockout

sorry for a noob question, just started with Knockout.js. I have an array of objects and I want to update the view when object property favorite: changes but every time I click on an icon that ...
0
votes
1answer
30 views

model and ui out of sync after manipulating DOM with jQuery - knockout.js

I have the following 3 checkboxes where only one at a time can be selected: <div class="radio-rows-wrapper" style="padding-top: 10px"> <input type="checkbox" ...
0
votes
0answers
17 views

Place search bar filters in a table made by knockout template

I have a table generated by a knockout template but I am not sure how to make changes to the table. I was able to successfully create searchable filters that visually sit above the table but I want ...
0
votes
0answers
22 views

How to put an input field into a knockout template

I have an input that is used to filter the columns in the table. This works but visually I want the input to appear inside the table. How my current code is written shows the input field above the ...
1
vote
2answers
54 views

Knockout js: Conditionally bind title attribute

I have several tabs at the top of the screen navigating users to several parts of the program. One of those tabs should now be highlighted if that part of the program has urgent notifications for the ...
0
votes
1answer
29 views

Trigger change event of element created using knockout js through console

Below is inspect element part of combobox. <select id="ddl-fund" aria-label="Funds" tabindex="0" data-bind="options: FundsAvailable, optionsText: 'Value', ...
0
votes
0answers
56 views

AJAX call from knockout.js function to controller action not setting server side view model properties

I have been following a pluralsight course in an attempt to learn how Client Side View Models can interact with server side controller actions. I have a basic view model with a couple of string ...
1
vote
2answers
39 views

How to change font-color for inactive list item?

The html code looks like this and creates tabs at the top of the screen for navigation to several parts of the program. <ul id="navigationMenuTop" class="nav navbar-nav" data-...
0
votes
1answer
20 views

KnockoutJs link only opens if i open on a new tab

I have a databinding below, which I can successfully right click and open on a new tab. But a normal click does not actually open that link. Anyone knows what I could be missing or doing wrong here? I ...
0
votes
1answer
26 views

how to select all ID fields inside ko.observableArray([])

I have a list like this as ko.observableArray([]) And I just need to have all ID fields inside it I coded this but I ran into some errors self.ApprovePersonAttendanceDataList().ID() and self....
1
vote
1answer
38 views

Knockout title not updating with observable

I have a knockout binding with a function that should update the title depending on whether the page is in edit mode or not. The function seems to be working as expected, returning an empty string in ...
1
vote
1answer
35 views

Are there any potential issues when binding an "async" method to a "on" event (e.g. click)?

I have a sync method which is called via click in Knockout.js I need to do some ajax calls for general purposes. Now, I don't want to necessarily wrap by click logic in many curly braces, hence why I ...
1
vote
0answers
44 views

knockout: unable to update the observable array in knockout while binding to table

I am having two tables. In one table(parent table) I have options to add and delete rows in that one column is a dropdown column. based on the selection I need to load another table(child table) with ...
1
vote
1answer
37 views

eonasdan bootstrap: unable to increase hours using hour arrow icon

I am using Eonasdan datetimepicker version : 4.17.47 by importing this JS file in a project. Also, I am using some custom validation to make sure that shows a red text when the user enters a time ...
0
votes
0answers
24 views

knockout losing model when pressing button for the second time

Got an old project in .net that needs few new features. We have a major problem with knockout somehow when pressing button for the first time everything works as it should, but when it is pressed for ...
0
votes
0answers
12 views

How is ko.utils.arrayPushAll(ObservableArray, SourceList) different in behavior than ObservableArray(SourceList)?

Given this: let source = ["one", "two", "three"]; let target = ko.observableArray<string>(null); I can do this: ko.utils.arrayPushAll(target, source); target....
0
votes
3answers
49 views

How to get li from a href value containing string

I've got the following html <ul id="navigationMenuTop" class="nav navbar-nav" data-bind="foreach: getRoutes"> <li data-bind="css: ..." > <a ...
0
votes
1answer
17 views

How to bind a collection of viewmodel in knockout

First of all, I'm quite new to knockout but I know the MVVM pattern it uses since I've done it in WPF a lot of time... by the way I've the following desiderata. I need to populate a bootstrap grid ...
0
votes
1answer
36 views

Use a function on a option datading in knockout.js

I have this dropdown on knockoutjs <p> text <select data-bind="options: optDiv, value: ligaSelec, optionsCaption: 'Divison' "></select>...
0
votes
0answers
21 views

knockout - header checkbox stays unchecked in table header when clicked

I am new to knockout and I am stuck at a problem for last couple of days - I am sure it is something silly but cant figure out. Any help will be appreciate. I am trying to select and deselect all rows ...
0
votes
1answer
24 views

How to get value which is used for div visible condition in c# selenium

<div data-bind="css: resultClass, visible: model.ticketId() !== ''" id="result"> ------------- </div> One of my html form page has div visible based on condition like ...
1
vote
1answer
22 views

KnockoutJs: observable array does not update, only when clearing and pushing items one-by-one

I have a knockout component (in my magento2 project) with a observableArray packageItems(): initialize: function (config) { this.packageItems = ko.observableArray([]); }, I also ...
0
votes
1answer
19 views

How to set "attr" binding element to not true?

I would like to know if it is possible to define a value that is not true in an attribute in this way. <div data-bind="visible:isActive, attr: { 'aria-hidden': !isActive() })"> { ...
0
votes
0answers
32 views

Knockout JS How to Access a Value from Second View Model / Binding

I am new to Knockout JS and think it is great. The documentation is great but I cannot seem to use it to solve my current problem. The Summary of my Code I have two viewmodels represented by two js ...
0
votes
1answer
21 views

How to use field value from subclass in overloaded function in constructor

The problem can be illustrated in this code: class A { public readonly x; constructor() { this.x = this.getX(); } protected getX() { return "X"; ...
0
votes
0answers
22 views

Import a Block into a Magento HTML file

In my Chekout_index_index.xml file, I have created a Block <referenceContainer name="content"> <block class="Magento\Customer\Block\Form\Register" name=...
0
votes
0answers
92 views

form submit event listener not working on pages with data-binding

In my JavaScript code there is a form submit event listener added as follows: form = document.querySelector('form'); form.addEventListener("submit", eventHandler, false); function ...
0
votes
2answers
53 views

knockout check all checkboxes in table column

I am new to knockout and trying to implement a table with the first column as a checkbox. When I click the header the whole column should get checked / unchecked. At the moment, it works when I click ...
1
vote
0answers
36 views

How can I sort the results of a javascript fetch from a rest api to present data to knockout bindings?

I am fetching data from a rest endpoint in my node.js application. w can I sort the results since I cannot modify the rest server to provide sorted data to begin with? I have spent a lot of time ...
0
votes
1answer
24 views

Knockout observable updates reflected only in inner scope

I'm trying to update an Observable from within an Ajax callback using... function LocaleVM() { const self = this; self.Language = ko.observable("en"); self.Strings= ko.observable(...
0
votes
0answers
27 views

JQuery Datatable with Select All Checkbox and Knockout

I have JQuery Datatable with checkbox functionality , in which the row and header elements are bound using knockout js. I'm fairly new to both of the concepts . I wish to implement a select all ...
0
votes
1answer
26 views

Knockout dropdown not updating after source array is updated

I have a dropdown that is populated from a view model's observable array. There is a button that is data-bound to a function that removes one of the elements from the array. When the button is clicked ...
0
votes
1answer
40 views

Why this polymorphic assignment does not work in typed observableArray in Knockout?

Let's have class A and subclass B. I want to assign an array of B's to array of A's. With normal arrays it works as expected, but with ko.ObservableArray it fails. import ko from "knockout"; ...
0
votes
0answers
14 views

KnockoutJS - Computed Observables don't bind to input

I have two model like this function CMRSerialsEditViewModel(data) { var self = this; this.CMRDeliverySerialId = ko.observable(); this.CMRSerialNumberFrom = ko.observable(); this....

1
2 3 4 5
407