From 3193dd39b9269fdb05d4ca1a1b56ccfc2d9d9991 Mon Sep 17 00:00:00 2001
From: louisik1 <louisik1@hotmail.com>
Date: Fri, 1 Aug 2025 12:43:14 -0700
Subject: [PATCH] Update multiselect.md valuePrimitive example

Adding element to show user the result of using valuePrimitive and how it only binds to the set dataValueField property instead of the entire value object.
---
 docs/api/javascript/ui/multiselect.md | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/docs/api/javascript/ui/multiselect.md b/docs/api/javascript/ui/multiselect.md
index 57b125e7d05..ceaadf49466 100644
--- a/docs/api/javascript/ui/multiselect.md
+++ b/docs/api/javascript/ui/multiselect.md
@@ -1392,16 +1392,28 @@ Specifies the [value binding](/framework/mvvm/bindings/value) behavior for the w
 
 #### Example - specify that the View-Model field should be updated with the selected item value
 
-    <select id="multiselect" multiple="multiple" data-bind="value: selectedProductId, source: products"></select>
+  <div id="container">
+    <select id="multiselect" multiple="multiple"
+            data-bind="value: selectedProductId, source: products"></select>
 
-    <script>
+    <div>
+      <h4>Selected Product IDs:</h4>
+      <div data-bind="text: selectedProductIdText"></div>
+    </div>
+  </div>
+
+  <script>
     $("#multiselect").kendoMultiSelect({
       valuePrimitive: true,
       dataTextField: "name",
       dataValueField: "id"
     });
+
     var viewModel = kendo.observable({
       selectedProductId: [],
+      selectedProductIdText: function () {
+        return this.get("selectedProductId").join(", ");
+      },
       products: [
         { id: 1, name: "Coffee" },
         { id: 2, name: "Tea" },
@@ -1409,8 +1421,8 @@ Specifies the [value binding](/framework/mvvm/bindings/value) behavior for the w
       ]
     });
 
-    kendo.bind($("#multiselect"), viewModel);
-    </script>
+    kendo.bind($("#container"), viewModel);
+  </script>
 
 ### virtual `Boolean|Object`*(default: false)*