문제

ASP.NET Datagrid 웹 컨트롤을 확장하여 많은 추가 기능을 추가하고 싶지만 가장 중요한 것은 그리드의 본문을 스크롤 할 수 있도록하고 싶습니다.

나는 HTML이 해결되었지만 제어의 렌더링을 무시하는 것은 혼란 스럽다. 최종 제어의 기본 구조는 다음과 같아야합니다.

<div id="grid1" class="grid">
<div class="grid-header">
    <div class="grid-header-l"></div>
    <div class="grid-header-c">
        <div class="grid-header-wrapper">
            <div class="wrapper">Grid Header</div>
        </div>
    </div>
    <div class="grid-header-r"></div>
</div>
<div class="grid-body">
    <div class="grid-column-headers">
        <div class="grid-column-headers-l"></div>
        <div class="grid-column-headers-c">
            <div class="grid-column-headers-wrapper">
                <table class="grid-column-header-table" cellpadding="0" cellspacing="0" border="0">
                    <tbody>
                        <tr>
                            <td>
                                <div class="grid-column-header-cell asc">
                                    <div class="grid-column-header-cell-wrapper">
                                        <div class="grid-column-header-text" title="Column Header Name">Column Header Name</div>
                                        <a href="javascript:;" class="grid-column-header-button" title="Hide/Show Columns"><span></span></a>
                                        <div class="grid-column-header-divider"></div>
                                    </div>
                                </div>
                            </td>
                            <td>
                                <div class="grid-column-header-cell">
                                    <div class="grid-column-header-cell-wrapper">
                                        <div class="grid-column-header-text" title="Column Header Name">Column Header Name</div>
                                        <a href="javascript:;" class="grid-column-header-button" title="Hide/Show Columns"><span></span></a>
                                        <div class="grid-column-header-divider"></div>
                                    </div>
                                </div>
                            </td>
                            <td class="last">
                                <div class="grid-column-header-cell">
                                    <div class="grid-column-header-cell-wrapper">
                                        <div class="grid-column-header-text" title="Column Header Name">Column Header Name</div>
                                        <a href="javascript:;" class="grid-column-header-button" title="Hide/Show Columns"><span></span></a>
                                        <div class="grid-column-header-divider"></div>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="grid-column-headers-r"></div>
    </div>
    <div class="grid-body-content">
        <div class="grid-body-content-t">
            <div class="grid-body-content-t-l"></div>
            <div class="grid-body-content-t-c"></div>
            <div class="grid-body-content-t-r"></div>
        </div>
        <div class="grid-body-content-m">
            <div class="grid-body-content-m-l"></div>
            <div class="grid-body-content-m-c">
                <div class="grid-body-content-wrapper">
                    <div class="scroll-wrapper">
                        <table class="grid-content-table" cellpadding="0" cellspacing="0" border="0">
                            <tbody>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                    <td>
                                        <div class="grid-content-cell">Cell Text/Value</div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="grid-body-content-m-r"></div>
        </div>
        <div class="grid-body-content-b">
            <div class="grid-body-content-b-l"></div>
            <div class="grid-body-content-b-c"></div>
            <div class="grid-body-content-b-r"></div>
        </div>
    </div>
</div>

누구든지 최선의 접근 방식이 무엇인지 아는 사람이 있습니까? 누구든지 튜토리얼을 가리킬 수 있습니까? 나는 저자가 렌더링 된 HTML을 응답 스트림으로 보내기 전에 렌더링 된 HTML을 캡처 한 곳을 발견했습니다. 그러나 나는 그 접근법을 사용하는 것을 좋아하지 않습니다.

도움이 되었습니까?

해결책 2

컨트롤의 출력 만 수정하고 싶었 기 때문에 '확장'은 실제로 렌더링을 무시해야한다는 것을 의미했습니다.

출력을 변경하는 데 사용할 수있는 제어 어댑터에 대한 기사를 찾았습니다. 프로젝트가 존재합니다 코드 플렉스 명명 된 'CSS 제어 어댑터'. Datagrid보다 더 많은 컨트롤에 매우 도움이되었습니다.

다른 팁

당신은 시도 할 수 있습니다 이것 접근하다. 나에게 잘 작동합니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top