{"id":1014,"date":"2023-07-05T17:48:38","date_gmt":"2023-07-05T09:48:38","guid":{"rendered":"https:\/\/www.tonghin.com.my\/blog\/?p=1014"},"modified":"2023-07-05T17:48:41","modified_gmt":"2023-07-05T09:48:41","slug":"optimizing-user-interface","status":"publish","type":"post","link":"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/","title":{"rendered":"Optimizing User Interface"},"content":{"rendered":"\n<p>In my previous blog post, I shared the difficulties I encountered while working on the contact management functionality. Specifically, I was facing challenges in enabling the ability to delete and update contacts in the contact list. Initially, my assumption was that the issue lay within the code responsible for updating the data in the database. My thoughts were that I might be missing a few code that is crucial for updating to the database.\u00a0<\/p>\n\n\n\n<p>After Mr. Peter reviewed the code, it was discovered that the main reason for the problem was the incorrect usage of a specific function. Specifically, instead of using the &#8220;Get contact by Id&#8221; function from the entity service, I had been using the &#8220;Read contact by Id&#8221; function. This incorrect usage of the function was causing the problem I was experiencing. In cases where modifications to the database were required, it was crucial to use the &#8220;Get&#8221; function. The key difference between the two functions was that the &#8220;Read&#8221; function utilized the &#8220;.AsNoTracking&#8221; feature, which instructed the code not to track any changes made. In my specific scenario, where updates and deletions needed to be reflected in the database, employing the &#8220;Get&#8221; function was imperative.<\/p>\n\n\n\n<p>Next, I proceeded to the next task on my agenda, which focused on optimizing the user interface. The first part of this endeavor involved making subtle but impactful modifications to the contact list interface. I paid close attention to the area where users added new contacts, ensuring that the process was intuitive and streamlined.<\/p>\n\n\n\n<p>The following task is to make the UI non-editable while users are in view mode. This aspect allowed me to implement and gain a better understanding of what data binding can do. I used binding to change the IsReadOnly property of TextBox elements based on their current mode. When in view mode, I set IsReadOnly to true, effectively preventing users from making any inadvertent changes. Conversely, in edit mode, I set IsReadOnly to false, empowering users to modify the necessary information.<\/p>\n\n\n\n<p>During this process, Mr. Peter also enlightened me about another valuable feature related to buttons. Specifically, he shared about how buttons could be dynamically hidden in certain scenarios. This feature proved particularly useful in scenarios where certain buttons were unnecessary or irrelevant, allowing for a cleaner and more focused user experience.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In my previous blog post, I shared the difficulties I encountered while working on the contact management functionality. Specifically, I was facing challenges in enabling the ability to delete and update contacts in the contact list. Initially, my assumption was that the issue lay within the code responsible for updating the data in the database. &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Optimizing User Interface&#8221;<\/span><\/a><\/p>\n","protected":false},"author":11,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[5],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v15.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Optimizing User Interface | Tong Hin&#039;s Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Optimizing User Interface | Tong Hin&#039;s Blog\" \/>\n<meta property=\"og:description\" content=\"In my previous blog post, I shared the difficulties I encountered while working on the contact management functionality. Specifically, I was facing challenges in enabling the ability to delete and update contacts in the contact list. Initially, my assumption was that the issue lay within the code responsible for updating the data in the database. &hellip; Continue reading &quot;Optimizing User Interface&quot;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/\" \/>\n<meta property=\"og:site_name\" content=\"Tong Hin&#039;s Blog\" \/>\n<meta property=\"article:published_time\" content=\"2023-07-05T09:48:38+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-07-05T09:48:41+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\">\n\t<meta name=\"twitter:data1\" content=\"2 minutes\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#organization\",\"name\":\"TONG HIN MACHINERY\",\"url\":\"https:\/\/www.tonghin.com.my\/blog\/\",\"sameAs\":[\"https:\/\/www.youtube.com\/channel\/UC60EoxJMNbu8mV0LuEGfrBg\"],\"logo\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#logo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/www.tonghin.com.my\/blog\/wp-content\/uploads\/2020\/10\/web_logo_180_180.jpg\",\"width\":180,\"height\":180,\"caption\":\"TONG HIN MACHINERY\"},\"image\":{\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#logo\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#website\",\"url\":\"https:\/\/www.tonghin.com.my\/blog\/\",\"name\":\"Tong Hin&#039;s Blog\",\"description\":\"Sharing About Technology\",\"publisher\":{\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/www.tonghin.com.my\/blog\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/#webpage\",\"url\":\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/\",\"name\":\"Optimizing User Interface | Tong Hin&#039;s Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#website\"},\"datePublished\":\"2023-07-05T09:48:38+00:00\",\"dateModified\":\"2023-07-05T09:48:41+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/\",\"url\":\"https:\/\/www.tonghin.com.my\/blog\/\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/\",\"url\":\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/\",\"name\":\"Optimizing User Interface\"}}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/#webpage\"},\"author\":{\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#\/schema\/person\/81e2366362d8d14b15519395755cee6f\"},\"headline\":\"Optimizing User Interface\",\"datePublished\":\"2023-07-05T09:48:38+00:00\",\"dateModified\":\"2023-07-05T09:48:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/#webpage\"},\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#organization\"},\"articleSection\":\"Experiential\",\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.tonghin.com.my\/blog\/2023\/07\/05\/optimizing-user-interface\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#\/schema\/person\/81e2366362d8d14b15519395755cee6f\",\"name\":\"nurlailiyuzi\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.tonghin.com.my\/blog\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/5c0d4cc6f7fc881bd56d95bdbb0c4c14?s=96&d=mm&r=g\",\"caption\":\"nurlailiyuzi\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/posts\/1014"}],"collection":[{"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/comments?post=1014"}],"version-history":[{"count":2,"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/posts\/1014\/revisions"}],"predecessor-version":[{"id":1018,"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/posts\/1014\/revisions\/1018"}],"wp:attachment":[{"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/media?parent=1014"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/categories?post=1014"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tonghin.com.my\/blog\/wp-json\/wp\/v2\/tags?post=1014"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}