Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 108,987

HOME > .NET Framework > Forum > C# Blazor เลือก CRUD แล้วหน้าที่ได้ออกมาแปลก ๆ ครับ



 

C# Blazor เลือก CRUD แล้วหน้าที่ได้ออกมาแปลก ๆ ครับ

 



Topic : 136256



โพสกระทู้ ( 4,350 )
บทความ ( 23 )



สถานะออฟไลน์
Facebook



111

หน้าตา ออกมาแบบนี้ครับ

222

ในขณะที่ ใน mvc ออกมาแบบนี้
33


ใน blazor ทั้งๆที่เลือกเป็น blazor page แล้วแต่ก็ยังได้ cshtml มาไม่รู้ว่าเป็นเรื่องปกติของการใช้ CRUD Scaffolded หรือปล่าวนะครับ



Tag : .NET, Win (Windows App), C#







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2021-07-10 17:44:38 By : lamaka.tor View : 564 Reply : 10
 

 

No. 1



โพสกระทู้ ( 296 )
บทความ ( 0 )



สถานะออฟไลน์


raw data เป็นแบบนั้นถูกแล้ว ที่ว่าแปลกเพราะมันไม่ได้ render CSS
ปกติถ้าเล่น MVC/core project, VS จะสร้างหรือแนบหรืออ้างอิงไปยัง CSS ให้ (ใน layout)
แต่ถ้าเป็น blazor project มีการพัฒนาไปใช้เทคโนโลยี SPA

SPA Architecture and Design
Layouts
Routing <- ไม่มีใน Razor client ต้องพึ่ง JS
Dependency Injection
Lazy Loading
Unit Testing

Quote:
Razor is a solution for server-based architecture which can handle api logic and server-side templating, but it cannot offer client-side logic outside of javascript.

Blazor is the next step (and hopefully successor) that will allow the same server side functionality as Razor, but will integrate client-side logic using C# instead of javascript.


Quote:
Razor is a templating engine that combines C# with HTML to build dynamic web content.

Blazor is a component-based, single-page app framework for building client-side web apps using .NET that works well with all modern browsers via WebAssembly for client-side Blazor. Server-side Blazor ASP.NET Core app runs on server and makes use of SignalR connection to communicate with the client (browser). It works with all modern browsers. In other words, Blazor is a hosting model for Razor components.


ส่วนที่ add มาแล้วเป็น cshtml ก็เป็นเรื่องปกติ เพราะเขาออกแบบมาแบบนั้น
แต่ .NET สามารถดึงเทคโนโลยีร่วมสมัยมาใช้ร่วมกันได้
ดังนั้น ถ้าจะใช้ scaffold item ร่วมกับ blazor app ก็ต้อง implement layout เอง

(
ถ้าถามต่อว่า implement อย่างไร คำตอบสั้นคือ เลียนแบบ layout ของ MVC/core project
คำตอบยาว ศึกษาพื้นฐานและ interact ด้วย keyboard แทนการเน้นเมาส์...คลิก nextๆ ...finish
)






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2021-07-11 12:24:47 By : TheGreatGod_of_Death
 


 

No. 2



โพสกระทู้ ( 296 )
บทความ ( 0 )



สถานะออฟไลน์


...แต่ Blazor CRUD ก็มีวิธี(ที่หลากหลาย) ของเขาเอง เช่น

https://www.c-sharpcorner.com/article/blazor-crud-app-using-entity-framework-core-in-net-5/
...
ฯลฯ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2021-07-11 12:30:47 By : TheGreatGod_of_Death
 

 

No. 3



โพสกระทู้ ( 4,350 )
บทความ ( 23 )



สถานะออฟไลน์
Facebook

ขอบคุณครับ
ตอนแรกนึกว่าผมทำอะไรผิดพลาดไปซะอีก
แต่ลองสร้างใหม่ และ เพิ่มใหม่ก็ยังเป็นเหมือนเดิม

เดี๋ยวจะศึกษาเพิ่มเติมอีกนะครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2021-07-12 07:52:00 By : lamaka.tor
 


 

No. 4



โพสกระทู้ ( 6 )
บทความ ( 0 )



สถานะออฟไลน์


หา Blazor development สีกคนครับ
ใคร สนใจ

[email protected]
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2022-05-20 21:02:46 By : sanong
 


 
.NET MAUI พึ่งจะมา (Mobile/Windows/Mac/etc... Single Codebase)
Blazor ก็เป็นส่วนหนึ่งในนั้น (Blazor MAUI)

สรุป .NET MAUI === Flutter + ReactJS
เยี่ยมยอดจริงฯ

.cshtml ก็แค่เปลี่ยนนามสกุลมันให้เป็น .razor ก็ได้แล้ว

ปล. ใช้ Blazor สำหรับงาน Native Client (ทะลุข้อจำกัด/ขีดจำกัดของ Web Browser) นี่ก็คุ้มค่าแล้ว
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2022-06-17 19:35:52 By : ผ่านมา
 


 
Code
// Demo Blazor Call C Language // (Pure C Language) file name: Pure_C.c int fact(int n) { if (n == 0) return 1; return n * fact(n - 1); }


Blazor (.razor)
Code (C#)
<p>@@Facterial(3) Result: @fact(3)</p> <!-- ผลลัพธ์ 6-->
@code {
    	// Native C
	[DllImport("Pure_C")]
	static extern int fact(int n);
}

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2022-06-17 19:58:11 By : ผ่านมา
 


 
Blazor (.razor)
ใช้ Jquery หรือว่า JavaScript บน .razor โดยไม่ต้องใช้เทคโนโลยี JavaScript Interop
(เคยเขียนเวปอย่างไรก็เขียนเหมือนนั่นแหละ)
แต่วิ่งได้หมดทุกฯอุปกรณ์(ไม่จำเป็นต้องผ่าน Web Browser/etc...)

Code (C#)
// Blazor.razor/MAUI Blazor)
<script>
var JiMi = "Very Big";
$(function() {
});
</script>


ปล. ไม่สนใจหรอกว่าใครจะใช้อะไร?
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2022-06-17 20:17:16 By : ผ่านมา
 


 
Single Code Base (ใช้ Source Code ชุดเดียววิ่งได้ทุกฯอุปกรณ์)
บริษัทไมโครซอฟท์พึ่งออก .NET MAUI (.NET 6 Productions)

คิดในแง่ดีมาช้าดีกว่าไม่มา ยกตัวอย่างงานจริงบน Blazor ให้ดูกัน (MAUI Blazor)

blazor_maui_01

Code (C#)
@inherits LayoutComponentBase
@inject Microsoft.Extensions.Configuration.IConfiguration config
<!-- Begin page content -->
<div id="container-main" class="container-fluid" style="margin-left:4px;margin-right:4px; margin-top:62px">
    <!-- home page -->
    <div id="page-home" class="active">
        <h1>หน้าหลัก</h1>
        <div class="block">
            <h2>Read AppSetting.json MyKey: @config["MyKey"]</h2>
            <h2>กว่าจะพบไม้งามยามขวานบิ่น</h2>
            <button id="btnDialog" type="button" class="btn btn-primary">แสดงข้อความโต้ตอบ</button>
            "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor "
            <img src="/assets/images/img18.png" class="img-fluid img-rounded" />
            <br />หอยงามเพราะขน
        </div>
        <div class="block">
            <h2>The standard Lorem Ipsum passage</h2>
            "Lorem ipsum dolor sit amet, elit, sed veniam, quis nostrud exercitation ullamco"
            Section 1.10.32 of "de Finibus Bonorum et Malorum", written by Cicero in 45 BC
        </div>
    </div>
    <!-- Feed page -->
    <div id="page-feed" class="inactive">
        <h1>นโยบาย</h1>
        <img src="/assets/images/img16.png" class="img-fluid img-rounded" />
        <div class="block">
            <h2>The standard Lorem Ipsum passage, used since the 1500s</h2>
            "Lorem ipsum dolor sit amet, consectetur xxx"
            Section 1.10.32 of "de Finibus Bonorum et Malorum", written by Cicero in 45 BC
        </div>
    </div>

    <!-- Create page -->
    <div id="page-create" class="inactive">
        <h1>แผนงาน</h1>
        <div class="block">
            <img src="/assets/images/img20.png" class="img-fluid img-rounded" />
        </div>
        <div>Hi Hi Hi</div>
    </div>

    <!-- Account page -->
    <div id="page-account" class="inactive">
        <h2>ค่าเริ่มต้น</h2>
        <img src="/assets/images/img18.png" class="img-fluid img-rounded" />
        <div class="block">
            <h2>The standard Lorem Ipsum passage</h2>
            "Lorem ipsum dolor sit amet, consectetur yes we fuck"
            Section 1.10.32 of "de Finibus Bonorum et Malorum", written by Cicero in 45 BC
        </div>
    </div>
</div>

<!-- Bottom Nav Bar -->
<footer class="footer">
    <div id="buttonGroup" class="btn-group selectors" role="group" aria-label="Basic example">
        <button id="home" type="button" class="btn btn-secondary button-active">
            <div class="selector-holder">
                <i class="icon-home2"></i>
                <b style="padding-top:6px;"><span>Home</span></b>
            </div>
        </button>
        <button id="feed" type="button" class="btn btn-secondary button-inactive">
            <div class="selector-holder">
                <i class="icon-users2"></i>
                <b style="padding-top:6px;"><span>นโยบาย</span></b>
            </div>
        </button>
        <button id="create" type="button" class="btn btn-secondary button-inactive">
            <div class="selector-holder">
                <i class="icon-law"></i>
                <b style="padding-top:6px;"><span>แผนงาน</span></b>
            </div>
        </button>
        <button id="account" type="button" class="btn btn-secondary button-inactive">
            <div class="selector-holder">
                <i class="icon-gear"></i>
                <b style="padding-top:6px;"><span>ค่าเริ่มต้น</span></b>
            </div>
        </button>
    </div>
</footer>
<FuckerScript>
    <script>
        var currentPageId = "page-home";
        var currentSelectorId = "home";
        $(function () {
            let pageIdList = ["home", "feed", "create", "account"]; //getButtons();
            pageIdList.forEach(function (page) {
                ['click', 'touchstart'].forEach(en => document.getElementById(page).addEventListener(en, changePage, false));
            });
            $("#btnDialog").on("click", function () {
                wls.jc.alert("ข้อความเตือน", "ผ่านรายการไปยังบัญชีแยกประเภทแล้ว <br> ไม่สามารถแก้ไขหรือลบทิ้งได้ <br><img src='/images/logo.png' />")
            });
        });
        function changePage(e) {
            e.preventDefault();
            let pageId = "page-" + this.id;
            if (document.getElementById(pageId).classList.contains("active")) {
                return;
            }
            let currentSelector = document.getElementById(currentSelectorId);
            let currentPage = document.getElementById(currentPageId);
            let page = document.getElementById(pageId);
            let pageSelector = document.getElementById(this.id);
            $(currentSelector).toggleClass("button-active button-inactive");
            $(currentPage).toggleClass("active inactive");
            $(pageSelector).toggleClass("button-inactive button-active");
            $(page).toggleClass("inactive active");
            $("#app").animate({ scrollTop: 0 }, "slow"); //ไปบนสุด
            currentSelectorId = this.id;
            currentPageId = pageId;
        }
    </script>
</FuckerScript>
@code {
    //ยังไม่ได้ทำอะไรเลย(Native Client ใช้เมื่อยามจำเป็น)
}

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2022-06-18 19:46:06 By : ผ่านมา
 


 
blazor_maui_02
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2022-06-18 19:56:33 By : ผ่านมา
 


 

No. 10



โพสกระทู้ ( 6 )
บทความ ( 0 )



สถานะออฟไลน์


๑ผ่านมา
เยี่ยมจริงๆ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2022-06-28 23:51:41 By : sanong
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : C# Blazor เลือก CRUD แล้วหน้าที่ได้ออกมาแปลก ๆ ครับ
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: Voake, Comcube, รับทำเว็บไซต์ รับเขียนโปรแกรม , pangpond.com , pangpond.co.th , สำนักงานบัญชี.com , รถมือสอง

Load balance : Server 04
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2022 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่