質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

2回答

6453閲覧

jQueryのDatatablesにつきまして

kazuhihi

総合スコア20

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2017/05/01 15:57

編集2017/05/03 09:15

イタリックテキスト
###前提・実現したいこと
Datatablesにaddする際に、特定の追加した行に色をつけたい。
追記:
CSSで変更しようとしましたが、td{ background-color: #ffd7d7;}で全部に変更はできましたが、
IDを指定して変更はできませんでした。ディベロッパーツールで確認してみると、addして追加した行にはtつけたはずのIDがついておりませんでした。
そのため、IDやCLASS名がつければCSSで変更できるかもしれません。
そのやり方を教えていただければと存じます。

###発生している問題・エラーメッセージ

特になし

###試したこと
まず、テーブルを作成し後から、Datatablesにしました。
その後、****.row.add####を使用して行を追加したのですが、それに色をつけたいのですがうまくいきません。タグに' style='background:#ffd7d7;'を入れたのですが変わりませんでした。。

###補足情報(言語/FW/ツール等のバージョンなど)
※試したコードです。
var test=["<td id='tes' style='width: 50px;'>05/02(火)</td>", "<td style='white-space: nowrap;'>さとし</td>","<td>00:00</td></tr>"]
kintai_data_table.row.add(test);
追記CSS:
td#tes{ background-color: #ffd7d7;}

上記コードで確認したのですが、ID:tesがうまく反映されておりませんでした。

より詳細な情報

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2017/05/01 17:04

書かれている状況が再現するコード(HTML/CSS/JavaScriptなど)を提示されたほうが回答を得やすいと思います。
kazuhihi

2017/05/01 19:55

申し訳御座いません。それは控えさせていただければと存じます。
masaya_ohashi

2017/05/02 00:19

やりたいことは「特定のセル1つだけ」を色付けしたいのですか?
kazuhihi

2017/05/02 07:56

たとえば列のIDを指定して特定のセルを色付けたいと思っております。
masaya_ohashi

2017/05/02 08:24 編集

試したコードでなく、動いた状態(色をつけようとする前)のコードを記載してください。
kazuhihi

2017/05/02 12:05

試したコードによりセルを追加。た形です。こちらのコードでは色付けはしておりません。例えばこの追加した行に色をつけたいです、
guest

回答2

0

https://datatables.net/reference/api/row.add()

Docを見る限り .row.add() はhtmlを入れるものではなくデータを入れるためのメソッドです。
.row.add()の直後に色を変えるためのサンプルコードがあるので適用してみますと、

javascript

1var rowNode = kintai_data_table.row 2 .add(data) 3 .draw() 4 .node(); 5 6$( rowNode ) 7 .css( 'color', 'red' );

こんな感じになります。
が、こちらには貴方のコードがないので正しく動くかはわかりません。試してみてください。

投稿2017/05/01 22:41

TakeoAsai

総合スコア880

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kazuhihi

2017/05/02 07:58

ありがとうございます。 kintai_data_table.row.add(追加内容); var row=kintai_data_table.draw(); $(row).css( 'bgcolor', 'red' ); 上記コードで試してみましたが、色に変化はありませんでした。 .node();はエラーが出たので使用しませんでした。
TakeoAsai

2017/05/02 08:02

> bgcolor おそらく background-color では?
kazuhihi

2017/05/02 12:03

かしこまりました。 background-colorに変更しましたが色に変化はありませんでした。
guest

0

自己解決

var test=["<td id='tes' style='width: 50px;'>05/02(火)</td>", "<td style='white-space: nowrap;'>さとし</td>","<td>00:00</td></tr>"]
kintai_data_table.row.add(test);

上記コードでIDが記入されなかったのはtdタグを記載したせいのようです。
下記コードに直したら問題なく反映されました。

var test=["<id='tes' style='width: 50px;'>05/02(火)", "<style='background:#d0cafd;'>さとし","00:00"]
kintai_data_table.row.add(test);

また、上記のようにタグの中にstyle='background:#d0cafd;'をすることによってセルの色の変更もできました。
ご回答いただいた皆様ありがとうございます。

投稿2017/05/03 10:13

kazuhihi

総合スコア20

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問